如何根据 TextField 的值创建复选框组件？

【问题标题】：How can I create a checkbox component based on value of TextField?如何根据 TextField 的值创建复选框组件？
【发布时间】：2021-05-26 02:49:48
【问题描述】：

我有 3 个组件 - 2 个文本字段和 1 个复选框 Material UI 组件。我希望仅当文本字段组件中有值时才选中该复选框？实现这一点的最佳方法是什么？

这是我的代码的链接：

【问题讨论】：

【解决方案1】：

您可以使用 length 属性检查文本内容的可用性。

const isTextFieldsNotEmpty = text1.length > 0 && text2.length > 0;

你可以在这里查看我的解决方案：

【讨论】：

是否可以进一步优化代码？在我的 UI 中，还有其他部分需要检查 3-4 个 TextField。所以按照这个逻辑，我需要为每个文本字段创建函数和状态变量
我认为这个例子会对您有所帮助：pluralsight.com/guides/… 您可以在一个状态属性中存储多个文本输入，并使用一个 onChange 回调处理多个输入文本内容