我在 react 中定義了一個 const 函式，如下所示：
const LazyOptions = () => {
return <Cascader options={options} loadData={loadData} onChange={onChange} changeOnSelect />;
};
現在我在外部函式中定義 onChange 并將其傳遞給這個LazyOptions函式：
const onChange = (value, selectedOptions) => {
var unique = value.filter(onlyUnique);
this.setState({
formValues:{
province: unique.toString()
}
});
};
LazyOptions(onChange)
但它顯示錯誤：
Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See for tips about how to debug and fix this problem.
我該怎么做才能解決這個問題？
uj5u.com熱心網友回復：
LazyOption像這樣在onchange Handler 中設定道具
const LazyOptions = ({onChangeHandler}) => {
return <Cascader options={options} loadData={loadData} onChange={onChangeHandler} changeOnSelect />;
};
并在您的父組件中傳遞該功能，它將運行良好
const onChange = (value, selectedOptions) => {
var unique = value.filter(onlyUnique);
this.setState({
formValues:{
province: unique.toString()
}
});
};
return <LazyOptions onChangeHandler={onChange} />
這也是一個小的作業示例，我的意思是代碼沙盒
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/371494.html
標籤：javascript 反应