這是我的調度功能：
DispatchRecipeID.js
import { useDispatch } from "react-redux";
import { UpdateRecipeID } from "../store/action/recipeId";
const DispatchRecipeID = (id) => {
const dispatch = useDispatch(); // dispatch
dispatch(UpdateRecipeID(id));
};
export default DispatchRecipeID;
現在我在另一個React JS檔案中使用這個DispatchRecipeID()函式。
導航欄.js
import React, { useState } from "react";
import DispatchRecipeID from "../../middleware/DispatchRecipeID";
const Navbar = () => {
// inputbox value
const [input, setInput] = useState("");
// get search item info from inputID. using inputID.id
const [inputID, setInputID] = useState(null);
// search function
const dispatchRecipeID = ()=>{
if(input !== "" && input !== null ){
DispatchRecipeID(inputID.id)
}
return
}
// ....... some code
return(
<div>
<input type="text" value={input} onChange={(event,value)=>{ setInputID(value) }} />
<button onClick={dispatchRecipeID(input)} >Search</button>
</div>
)
}
export default Navbar;
但我得到錯誤：
錯誤：無效的掛鉤呼叫。鉤子只能在函陣列件的主體內部呼叫。
這里的完整錯誤：
react-dom.development.js:14906 未捕獲的錯誤：無效的鉤子呼叫。鉤子只能在函陣列件的主體內部呼叫。這可能由于以下原因之一而發生：
- 你可能有不匹配的 React 版本和渲染器（例如 React DOM）
- 您可能違反了 Hooks 規則
- You might have more than one copy of React in the same app See
How to fix this error? And I want use DispatchRecipeID() function at "3 or 4 JS" files like as Navbar.js
請幫助我，謝謝:)
uj5u.com熱心網友回復：
只是為了提醒反應鉤子中的重要規則之一，您不能在嵌套函式中使用鉤子，如果您違反此規則，它們將不起作用
檢查您的所有組件
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/422960.html
標籤：
下一篇：如何在單個陣列中獲取陣列資料