Question

我有点困惑......

我有一些像这样的代码

renderTopic(topic){
    if(topic.isMine){console.log('work?')}
        return (
            <View key={topic.id.toString()} >
                <TouchableOpacity onPress={() => this.addToic.call(this, topic)} >
                    {topic.isMine && <Topic topic={topic} active={true}/>}
                    {!topic.isMine && <Topic topic={topic} active={false}/>}
                </TouchableOpacity>
            </View>
        )
    }

render() {
    console.log("re-rendering", this.props.myTopics)
    return (
        <View style={s.welcome}>
            <ScrollView>
                <View style={s.topics}>
                    {this.props.me.myTopics.map(topic => this.renderTopic(topic) )}
                </View>
            </ScrollView>
        </View>
        )
    }

问题是当我使用传统的redux更新主题时 - ＆gt; ＆＃39;派遣行动＆＃39;方法，重新渲染函数触发，应该组件更新函数触发，一切看起来都有效，但topic.isMine条件渲染永远不会更新并切换组件。

如果我更改了页面，则会显示正确的结果，然后应用程序会重新正确呈现。

Answer 1

可能你的reducer不会创建新的topic对象。 React看到，对新主题的引用与旧主题匹配，并且跳过调用renderTopic(topic)与之前相同的引用值。

尽管渲染函数正在运行，但React Native Component不会重新渲染

1 个答案: