N
@sunnylqm 谢谢回复，问题找到了，不是我说的原因。下面这样是没问题的，会触发B和C的更新，与语法无关....
A组件：
constructor(props) {
super(props);
this.state = {
data:{'name':'小怪兽'}
};
}
componentDidMount() {
this.upFn()
}
upFn() {
let data = {'name':'凹凸曼'}
setTimeout(() => {
console.log('开始更新');
this.setState({
data: data
})
},3000)
}
render() {
return (
<View>
<B name={this.state.data.name}/>
<C name={this.state.data.name}/>
</View>
)
}
B组件：
constructor(props) {
super(props);
this.state = {
name: this.props.name
};
}
componentWillReceiveProps(nextProps) {
if (nextProps.name != this.props.name) {
this.setState({
name: nextProps.name
})
}
}
render() {
return (
<View>
<Text>Component B: {this.state.name}</Text>
</View>
);
}
C组件：
getInitialState: function() {
return {
name: this.props.name,
};
},
componentWillReceiveProps(nextProps) {
if (nextProps.name != this.props.name) {
this.setState({
name: nextProps.name
})
}
},
render: function(){
return(
<View>
<Text>Component C: {this.state.name}</Text>
</View>
);
}
暂且找到的原因是 react-native-tabbar 组件，如下写法就不会触发B(componentWillReceiveProps)里的更新....
D组件：
constructor(props) {
super(props);
this.state = {
data:{'name':'小怪兽'}
};
}
componentDidMount() {
this.upFn()
}
upFn() {
let data = {'name':'凹凸曼'}
setTimeout(() => {
this.setState({
data: data
})
},3000)
}
render() {
return (
<Tabbar ref="myTabbar" barColor={'rgb(0, 0, 0)'}>
<Tab name="赛事">
<IconWithBar label='赛事' onInactiveColor={'white'} onActiveColor={'red'} type={glypy.Match} ontype={glypy.MatchOn} from={'tabbaricon'}/>
<RawContent>
<View>
/*但如果这里直接写<A />，并把D中设置data 和更新data的方法去掉，就又能更新B了......不知道啥原因*/
<B name={this.state.data.name}/>
</View>
</RawContent>
</Tab>
</Tabbar>
）
}
