javascript - 状态没有通过 this.setstate 以 React 形式设置
问题描述
我正在 React 中构建一个表单。单击取消应用程序组件中的表单需要重置我从另一个组件数据获取的状态
class App extends React.Component {
constructor(props){
super(props);
this.Data = React.createRef();
this.state = {
fruits:["Mango","Apple","Banana"],
};
}
//reset method in App called on clicking cancel in form
resetForm(e){
e.preventDefault();
const resetState = this.Data.current.getFruit();
console.log(resetState);
this.setState({
state: resetState
});
}
//class in different file
export class Data extends React.Component {
getFruit() {
return {
fruits: [
"Mango",
"Apple",
"Bananna"
]
}
//more code below
}
当我在 resetForm 方法中控制台 resetState 时,我可以从 Data 组件中获取初始状态,但它不会将其设置为 App 中的状态。我究竟做错了什么?我是 React 新手
解决方案
当您使用该setState
方法时,React 已经知道它应该应用于 state 属性,因此您应该使用以下方式调用该方法:
this.setState(resetState);
推荐阅读
- excel - 复制行,将新工作表粘贴为包含数据的最后一行,然后从源工作表中删除行
- java - 在java中连接两个线程
- python - 使用迭代器组合多个条件
- jenkins - Jenkins Gitlab 集成 - 仅基于推送到主分支构建
- haskell - Control.Lens.Plated.transform 在使用 Data.Data.Lens.uniplate 提供 Plated 实例时不会遍历整个结构
- windows - 将多个 Zip 中的特定文件类型提取到 Powershell 中的一个文件夹
- c++ - 将使用 bitset 转换的二进制数放入向量中
- pandas - Pandas Pivot 多个日期列
- r - R:按ID计算特定日期之前的天数
- recursion - cudaErrorIllegalInstruction 递归函数调用