javascript - 添加的数据不会在 useEffect() 中自动更新 需要刷新浏览器才能获得最后的添加

Question

我在小应用程序中遇到了麻烦。我有一个向数据库添加数据的组件。效果很好。在其他组件中，我在 useEffect() 中获取数据并从 db 中进行搜索。同样运作良好。这两个组件在我的 App.js 中返回。问题是当我添加数据并去搜索时，我需要刷新页面以搜索最后一次添加。因此，如果我不刷新页面，它就找不到它。如何解决这个问题？（如果可能，稍微解释一下）:)

来自组件 Search.js

 useEffect(()=>{
        axios.get("http://localhost:3004/api/list/").then(resp=>{
            console.log(resp.data)
            setList(resp.data) ;
        })
    },[])

从组件

const AddData = () =>{
    const [name, setName] = useState();
    const [tel, setTel] = useState();
    const [gender, setGender] = useState();
    
    const dispatch = useDispatch();


    const handleSubmit = (e) => {
        e.preventDefault();
        // starting to work to save input to DB via API 
        //  dispatch(addList(name,tel,gender));
        dispatch(addList(name,tel,gender))
    }
    return(
    ```
    

标签： javascriptreactjs

Answer 1

由于依赖数组为空，useEffect 像 componentDidUpdate 一样只运行一次。