Javascript 如何以及何时检查数组中的所有对象值是否不为null？

我有一个React组件，它具有多个具有不同数据类型的动态输入字段。我想将输入值保存在状态（答案）中，如下所示：

{[id]：value}

可能的数据输出示例：

[
  {
    '72ebbdc4-8001-4b53-aac0': 'John doe'
  },
  {
    'dd3179c1-90bc-481c-a89e':
      '5b6d2f55-8ed0-4f76-98e69'
  },
  {
    '5acff3c7-02f8-4555-9232': 4
  },
  {
    '877817a8-6890-464b-928e': false
  },
  {
    '69e11e5a-613f-46ac-805d': []
  },
  {
    '0bb9c2f3-eda7-4e96-90f6': [
      'ad9d4c72-0972764cf9b71c42',
      'da788b55-3b68-a9c669c0ec1a'
    ]
  },
  {
    'e9c2196f-871f-25e6efb2551f': '2020-12-23'
  },
];

我的React组件如下所示。

InputField

是一个基于问题类型的开关。当输入更改时，调用

updateState

，并更新

此.state.answers

。在用户导航到下一个屏幕之前，需要填写所有问题->

this.state.answeredAllQuestions

export default class EditComponent extends Component {
  state = {
    questions: [],
    answers: [],
    answeredAllQuestions: false
  };

  async componentDidMount() {
    await this.fillQuestions();
  }

  // I think need a working alternative for this part
  componentDidUpdate() {
    if (!this.state.answeredAllQuestions) {
      this.checkRequiredQuestions();
    }
  }

  fillQuestions = async () => {
    const {
      response: { questions }
    } = await getQuestions();

    // Turn questions from api into answers -> [key]:value
    const answers = questions.map(el => {
      return { [el.uuid]: el.value };
    });

    this.setState({
      questions,
      answers
    });
  };

  checkRequiredQuestions = async () => {
    const { answers } = this.state;

    if (answers) {
      const values = answers.map(x => Object.values(x)[0]);

      if (
        values.every(answer => {
          (answer.required && answer !== null) || answer !== '';
        })
      ) {
        this.setState({ answeredAllQuestions: true });
      } else {
        this.setState({ answeredAllQuestions: false });
      }
    }
  };

  updateState = (value, id, nestedId) => {
    const { answers } = this.state;

    if (answers) {
      // Check if answer already exists in the state, if so then replace it 
      this.setState({
        answers: this.state.answers.map(el =>
          Object.keys(el)[0] === id ? { [id]: value } : el
        )
      });
    } else {
      this.setState({
        answers: [{ [id]: value }]
      });
    }
  };

  render() {
    const { questions, answers } = this.state;

    return (
      <View>
        <FlatList
          data={questions}
          renderItem={({ item: question }) => (
            <View key={question.id}>
              <Text>{question.label}</Text>
              <InputField
                type={question.type}
                answers={answers}
                updateState={this.updateState}
                question={question}
              />
            </View>
          )}
        />
      </View>
    );
  }
}

导出默认类EditComponent扩展组件{
状态={
问题：[]，
答复：[]，
回答所有问题：错误
};
异步组件didmount（）{
等着吧。填写问题（）；
}
//我认为这部分需要一个可行的替代方案
componentDidUpdate（）{
如果（！this.state.answeredAllQuestions）{
这是。checkRequiredQuestions（）；
}
}
fillQuestions=async（）=>{
常数{
答复：{问题}
}=等待获取问题（）；
//将api中的问题转换为答案->[关键]：值
const answers=questions.map（el=>{
返回{[el.uuid]：el.value}；
});
这是我的国家({
问题，
答案
});
};
checkRequiredQuestions=async（）=>{
const{answers}=this.state；
若有(答案){
const values=answers.map（x=>Object.values（x）[0]）；
如果(
值。每个（答案=>{
（answer.required&&answer！==null）| | answer！==''；
})
) {
this.setState（{answeredAllQuestions:true}）；
}否则{
this.setState（{answeredAllQuestions:false}）；
}
}
};
updateEstate=（值、id、nestedId）=>{
const{answers}=this.state；
若有(答案){
//检查状态中是否已存在答案，如果已存在，则将其替换
这是我的国家({
答案：this.state.answers.map（el=>
Object.keys（el）[0]==id？{[id]：value}:el
)
});
}否则{
这是我的国家({
答案：[{[id]：value}]
});
}
};
render（）{
const{questions，answers}=this.state；
返回(
(
{question.label}
)}
/>
);
}
}

这段代码的一个大问题是，当所有输入字段都被填充时，

this.state.answeredAllQuestions

设置得太真实了。但是当用户从输入字段中删除一个值时，它不会更新回false

我不希望有人修复我的代码，但我现在真的需要一些帮助

如果（值）。每个（答案=>
（answer.required&（answer！==null | | answer！==''）| | answer===''）

---

如果需要回答，则需要检查是否为空字符串。

通过将

HandleInput

函数传递给所有输入组件进行修复，该函数检查每个数据类型是否为真，并将该值置于

EditComponent

状态