反應本地列表視圖時，行與它自己的狀態的組件

Question

這裏是我的主要組成部分的簡化exctracts沒有更新：

// this is only to simulate a change 
componentDidMount() { 
    setTimeout(() => { 
    this.setState({ 
     dataSource: this.state.dataSource.cloneWithRows([ newVehicle ]), 
    }) 
    }, 5000) 
} 

render() { 
return (
    <ListView 
    dataSource={this.state.dataSource} 
    renderRow={this.renderVehicle} 
    /> 
) 
} 

renderVehicle(vehicle) { 
    // here vehicle.name is properly updated 
    return <Text>{vehicle.name}</Text> // this would be working 
    return <Vehicle parentObject={ vehicle } /> // this is not working 
} 

這裏是我的車輛部件：

// In here it seams the component is not rebuilt, 
// and this.props.parentObject is always the old value... 

this.state = this.props.parentObject 

return() { 
    <Text>{this.state.name}</Text> 
} 

注意：現實生活中的車輛是一個複雜的組件，需要擁有自己的狀態。

Answer 1

據我瞭解的問題，你需要在車輛使用componentWillReceiveProps(nextProps:Object)與nextProps更新狀態。

簡單的例子：

componentWillReceiveProps(nextProps) { 
    const { name } = nextProps; 

    this.setState({name}); 
}