React Native setState

Question

我正在尝试从渲染函数更改我的状态，但它不起作用。

render() {
return (
<View>
// some code
{this._renderModal()}
</View>
)
}
_renderModal() {
let channel = this.props.pusher.subscribe('my-channel');
channel.bind('my-event', data => {
this.setState({
requestedToEnter: false
});
this.props.navigation.getNavigator('root').push(Router.getRoute('order', { restaurant_id }));
});
return (
<Modal
animationType={'slide'}
transparent={false}
visible={this.state.requestedToEnter}
onRequestClose={this._handleEnter}>
// some components
</Modal>
)
}

当我在my-channel上收到my-event时，它会触发绑定到它的函数。setState方法不会更改状态(或者它会更改但不重新呈现组件)。我认为这是因为我在事件函数中使用了setState方法。当我收到推送器的事件时，如何关闭Modal？

Answer 1

在 render() 中调用 this.setState 函数是一种不好的做法，因为每次调用 setState 时，组件将使用绑定到组件/子组件的更新状态值来呈现自身。

或者，您可以创建一个状态变量

this.state = {
isModalOpen: true
}

并将推送器事件侦听器放在 componentDidMount() 中，并在回调中更新状态变量值。然后，使用状态变量控制模态组件可见性：

<Modal
animationType={'slide'}
transparent={false}
visible={this.state.isModalOpen}></Modal>