react-native - setState() 将 Proxy 对象添加到属性而不是 react native 中的字符串值

Question

这是一个非常奇怪的问题，我确定我忽略了一些非常简单的事情。

当我加载新组件 AddNewCategory 时，我最初将空字符串设置为 this.state 上的 text 属性。登录控制台显示 text 值也为空。

我使用 Button 组件的 onChange 更新这个值。我知道 text 属性目前正在按预期更新，因为输入字段的值会相应更改。

<Button onChange={text=>this.setState({})}>

但是当我尝试检索 text 属性的值时，我看到 text 现在被分配了一个 Proxy 而不是一个字符串> 对象。

我只是想获取输入字段的值，以便将值传递给 Action 创建者。

这是完整的代码，

import React from 'react';
import { View, Text, TextInput, Button} from 'react-native';

class AddNewCategory extends React.Component {
  constructor(props) {
    super(props)
    this.state={
      text: ''
    };
    console.log('after initialising constructor');
    console.log(this.state);
    this.onContinueButtonPress = this.onContinueButtonPress.bind(this);
  }
  onContinueButtonPress() {
    console.log('after onContinueButtonPress');
    console.log(this.state);
    this.props.addNewCategory('Random Value');
  }
  render(){
    return(
      <View>
        <Text>Name your new task list</Text>
        <TextInput
          placeholder="Things to do today.."
          value={this.state.text}
          onChange={(text)=>this.setState({text: text})}
        />
        <Button
          title={'Continue'}
          onPress={this.onContinueButtonPress}
        />
      </View>
    );
  }
};

export default AddNewCategory;

Answer 1

我不知道你为什么要给 Button 组件一个 onChange Prop 。

无论如何，对于 TextInput，您应该提供 onChangeText 属性。

<TextInput onChangeText={text => this.setState({ text })}

其他属性已省略。

仅使用onChange 就像在进行Web 开发时处理通常的onChange 事件，其中回调方法的第一个参数仅提供事件；要获得实际输入值，您必须说 event.target.value。

onChange={(event) => console.log(event.target.value)}