reactjs - 我的组件正在尝试访问尚不存在的数据，“无法读取未定义的属性‘数据’”

Question

我的组件试图 mapStateToProps 一些在用户输入和提交之前不存在的表单数据。该表单将获取输入，将其存储到 redux 中，然后我将能够获取该数据并在 API 调用后填充表

const StepOne = props => {
  const [formObj, setFormObj] = useState({
    rigName: "",
    desc: "",
    choices: [
      {
        choice: "",
        customAttribute: ""
      }
    ]
  });

  return (
    some inputs fields
  );
};
const mapStateToProps = state => {
  return {
    formData: state.stepOneForm.data
  };
};
const mapDisptachToProps = disptach => {
  return {
    addFormIntoRedux: data => disptach(AddFormData(data))
  };
};
export default connect(mapStateToProps, mapDisptachToProps)(StepOne);

我发现其他帖子建议我包含初始数据？或在渲染后进行检查，但我不确定那会是什么样子。我相信这些选项可能是解决方案，但不确定如何从这里开始。

你可以在这里看到错误

标签： reactjsreduxstate

Answer 1

我认为这可以解决您的问题：

const mapStateToProps = state => {
  return {
    formData: state.stepOneForm ? state.stepOneForm.data : null,
  };
};

null对于未定义的情况，我将其用作默认值stepOneForm，但您可以根据需要进行更改。