Question

我知道，本机反应的做法是使用onChangeText来更改值，如下所示。

<TextInput 
  onChangeText = {(text)=> this.setState({myText: text})}
  value = {this.state.myText}
/>

但是，我想知道我是否可以做这样的事情。总而言之，我想遍历所有TextInput并得到ref和value。我只想按照以下步骤在javascript way中进行操作。可以做到吗？

    <TextInput id="id1" ref={ref => (this.remark = ref)} />
    <TextInput id="id2" ref={ref => (this.remark1 = ref)} />

onSubmit = () => {
        forEach(TextInput in component) {
           console.log(TextInput.id) <- note id is custom property
           console.log(TextInput.refName)
           console.log(TextInput.value)
        }
}

Answer 1

是的，但是我不推荐这种方法。您可以简单地创建一个ref数组并在onSubmit函数中循环遍历。

Answer 2

forEach（组件中的TextInput）{

在任何JavaScript环境中都是不可能的（不仅因为forEach和for..in的语法不同，而且您不能指望能够按类型（？）遍历组件元素，并且得到它们）

您要执行的操作不是JavaScript方式，而是旧式浏览器方式：

本机没有id
从技术上讲，您可能会获得不受控制的TextInput值，就像在浏览器环境中（通过this.textInputRef._lastNativeText在普通反应中所做的那样），但在React-native中不鼓励这样做，这很可能是因为非DOM react native必须将Native呈现为native视平台（iOS，Android，Windows等）而异的视图，但必须使用相同的视图

因此，不仅在本机反应中是不可能的，在普通反应中也是如此。在我看来，您想要创建一个表单，迟早您会发现想要对输入进行验证或转换，然后无论如何都要切换回受控组件

循环并获取组件/屏幕中的所有TextInput值

2 个答案: