反应自定义 TextInput 控件无法输入任何内容

Question

我有一个控件 MyCustomTextInput 如下

function MyCustomTextInput (props)
 return {
    <div>
       <TextInput
            value={props.value} </TextInput>
    </div>
}

这个MyCustomTextInput在表单上使用如下

<td>
   <MyCustomTextInput value="MyModelClass.MyName"> </MyCustomTextInput>
</td>
<td>
   <MyCustomTextInput value="MyModelClass.MyAddress"> </MyCustomTextInput>
</td>

我遇到的问题是 - 我可以看到自定义控件中加载了 MyName 和 MyAddress，但我无法在文本控件中键入任何内容

你能告诉我我在这里遗漏了什么吗

感谢您的帮助

Answer 1

你的代码看起来有点奇怪，所以我对它做了一些修改。首先，您应该将您的值放入文本输入字段的 defaultValue 属性中。所以它应该看起来像：

function MyCustomTextInput (props) {
    return (
        <div>
            <textarea defaultValue={props.value}></textarea>
        </div>
    );
}

接下来，我建议您为表单元素（如文本区域、输入等）设置组件状态...所以我会使其看起来像：

function MyCustomTextInput (props) {
    const [textareaValue, setTextareaState] = useState(props.value);
    const handleTextareaChange = (event) => setTextareaState(event.target.value);

    return (
        <div>
            <textarea defaultValue={textareaValue} onChange={handleTextareaChange}></textarea>
        </div>
    );
}

反应自定义 TextInput 控件无法输入任何内容

React custom TextInput control not able to type anything

javascript

textinput

reactjs

react-native