Javascript 反应-当道具通过父级状态更新时，子级不更新

我有一个反应本机组件-

export default class Chat extends Component {
  constructor(props) {
    super(props);

    this.state = {
      behavior: 'padding',
      text: '',
      messages: this.props.chat.messages
    };
  }

  updateText() {
    this.setState({
      messages: this.state.messages.concat( { message: this.state.text } )
    })
  }

  render() {
    return (

      <KeyboardAvoidingView behavior={this.state.behavior} style={styles.container}>
        <View style={styles.chatContainer}>
          <MessageList messages={this.state.messages} />
        </View>
        <View style={styles.textContainer}>
          <BorderedTextInput
            placeholder="Type something..."
            onSubmitEditing={ this.updateText.bind(this) }
            onChangeText={(text) => this.setState({text})}
            value={this.state.text}
            style={styles.textInput} />
          <IconBar />
        </View>
      </KeyboardAvoidingView>

    );
  }
}

导出默认类聊天扩展组件{
建造师（道具）{
超级（道具）；
此.state={
行为：'填充'，
文本：“”，
消息：this.props.chat.messages
};
}
updateText（）{
这是我的国家({
messages:this.state.messages.concat（{message:this.state.text}）
})
}
render（）{
返回(
this.setState（{text}）}
值={this.state.text}
style={styles.textInput}/>
);
}
}

它的消息数组处于使用文本输入时更新的状态。这将传递给MessageList组件

export default class MessageList extends Component {
  constructor(props) {
    super(props);
    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
    this.state = {
      dataSource: ds.cloneWithRows(this.props.messages),
    };
  }

  _renderRow(chat){
    return (
      <FadeInListRow>
        <View style={this._bubbleContainerStyle(chat)}>
          <Text style={this._bubbleStyles(chat)}>{chat.message}</Text>
        </View>
      </FadeInListRow>
    )
  }

  render() {
    return (
      <View style={styles.container}>
        <View style={styles.timeContainer}>
          <Text style={styles.timeText}>
            Mon, Jun 2, 22:09
          </Text>
        </View>

        <ListView
          dataSource={this.state.dataSource}
          renderRow={this._renderRow.bind(this)}
          contentContainerStyle={styles.listView}
           style={{flex: 1, paddingTop: 50}}
        />
      </View>
    )
  }
}

导出默认类MessageList扩展组件{
建造师（道具）{
超级（道具）；
const ds=new ListView.DataSource（{rowHasChanged:（r1，r2）=>r1！==r2}）；
此.state={
数据源：ds.cloneWithRows（this.props.messages），
};
}
_renderRow（聊天室）{
返回(
{chat.message}
)
}
render（）{
返回(
6月2日，星期一，22:09
)
}
}

---

我希望再次调用_renderRow，并在更新父状态时更新我的列表视图。事实并非如此。知道我做错了什么吗？

当前的代码似乎没问题。我建议两件事：

确认

状态

中的

消息

属性确实已更新

onSubmit（）

。您可以在

chat

类的

return

命令之前记录它

确认

MessageList

组件上的

props

中的

message

属性，该属性在父组件更新的相同周期内进行更新

---

我这样说有一个前提：状态更新的大多数问题通常是因为与数据更新不一致。如果数据没有更改，组件将不会被重新呈现。

尝试将

renderRow={this.\u renderRow.bind（this）}

更改为

renderRow={this.\u renderRow（）}

@MiGu3X-这也是我最初的想法，但是ListView组件在这里需要一个函数：您至少可以尝试一下吗，或者它根本不起作用？，你可以把renderRow={（）=>{this.\u renderRow（）}}@MiGu3X:这没什么区别。