javascript - 通过输入设置组件中的状态

我试图在我的组件中设置输入的状态，并在我的app.js中使用它。我怎样才能用道具做到这一点？我尝试了onChangeText={(tips) => this.setState({comment})}，但我只得到了未定义的信息。

const Comments = (props) => {
  return (
    <View style={styles.container}>
<Input style={styles.field}
  autoCorrect={false}
  autoCapitalize="none"
  onChangeText={props.onChangeText}
  placeholder="Skriv en kommentar..."
/>
<Button rounded style={styles.button} onPress={() => props.addComment(props.id)}>
  <Text style={styles.buttonText}>Kommenter</Text>
</Button>
</View>
  )
}
export { Comments };

在我的app.js中，我有：

我的app.js

    export default class Home extends Component {
    constructor(props){
    super(props);
    this.state = {
      comment: '',
    }
   newComment = (comment) => {
      change = (comment) => this.setState(comment)
      alert(comment)
   }
  renderItem = ({ item, index }) => {
   return (
       <Comments
          addComment={this.newComment}
          comments={this.state.comment}
          onChangeText={this.change}
        />
   )
  }
 }

最佳答案

您不能在无状态组件中使用setState。
您需要从父函数传递一个handler，该父函数会根据onChangeText更改值

父级

change = (comment) => this.setState({comment})

<Comments
   comments={this.state.comment}
   onChangeText={this.change}
/>

儿童

const Comments = (props) => {
  return (

    <Input style={styles.field}
      ...// other stuff
      onChangeText={props.onChangeText}
    />

    </View>
  )
}

关于javascript - 通过输入设置组件中的状态，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52304320/