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

setState() adds a Proxy object to property instead of string value in react native

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

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

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

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

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

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

这是完整的代码,

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;

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

无论如何,对于 TextInput,您应该给 onChangeText 属性。

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

其他属性已被省略。

只使用onChange就像在做web开发时处理通常的onChange事件,回调方法的第一个参数只给出事件;要获得实际输入值,您必须说 event.target.value.

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