javascript - 设置状态后无法编辑 inputText [react-native]

Question

发送获取请求后，保存在状态数据中，并显示保存在 inputText 中的值我不能再编辑它了。否则，当我输入清楚时它会起作用。

代码如下:

第一步，我在 input.js

上提交 textInput 后​​获取所需的数据

<TextInput
    style={[ style.itemInfoMajor, global.alignRight ]}
    onFocus={ onFocus }
    onChangeText={ this._onChange }
    onSubmitEditing={ () => this._onSubmit(network) }
    value={ value }
    returnKeyType="done"
    enablesReturnKeyAutomatically={ true }
    clearButtonMode="always"
    placeholder={ network }
    placeholderTextColor="rgba(255, 255, 255, 0.25)"
    autoCorrect={ false }
    autoCapitalize="none"
    clearTextOnFocus={ true }
/>

在 list.js 上，我在加载应用程序后检索数据。

它在那里我设置状态谁获得 inputText

的值

componentWillMount() {
  this._loadInitialState().done();
},


async _loadInitialState() {
  try {
    const value = await Storage.get('userData');

    if (value !== null) {
      this.setState({
        data: value,
      });
    }
  }
}

下面是我将状态传递给输入组件的地方

<Input
  onFocus={ this._handleFocus.bind(this, item) }
  value={ value }
  ref={ item }
  key={ i }
  network={ item }
/>

我加入了一个小视频来实时观看问题:https://vid.me/8L9k源代码在这里:https://github.com/statiks/statiks-react-native/blob/master/sources/input/index.js

我该如何编辑此输入的值？

Answer 1

尝试在 getInitialState 中设置值:

getInitialState() {
  return {
    ...,
    value: this.props.value
  };
},  

然后，在 textInput 中使用 this.state.value:

<TextInput
  ...
  value={ this.state.value }
  ... />

然后，在更改时更新值状态:

_onChange(username) {
  this.setState({ value: username });
 },

看起来您可能将不正确的值作为 prop 向下传递。您需要传递 this.state.data 而不是值:

<Input
 value={ this.state.data }
 ref={ item }
 key={ i }
 network={ item }
/>

我没有你的完整代码，但我测试了它，它似乎对我有用。 (您可能需要将父级数据的初始状态设置为空字符串或数据结构)