使用 react-native-navigation 显示组件时如何触发事件? [英] How to trigger an event when a component is shown when using react-native-navigation?

问题描述

我正在使用 react-native 和 react-native-navigation.我想在显示组件时重新加载数据.当用户单击选项卡导航按钮时会显示该组件.

I am using react-native with react-native-navigation. I would like to reload data when a component is shown. The component is shown when a user clicks on a tab navigation button.

我应该使用 react 生命周期事件还是 react-native-navigation 中的某些内容可以在用户导航回组件时触发功能?

Should I use react life cycle events or is there something in react-native-navigation that can trigger a function when a user navigates back to a component?

我正在使用 redux，我不确定它是否可以用来帮助?

I am using redux, I am not sure if that could be used to help?

这个问题是指 onDisplay 这似乎是我正在寻找的.但是我找不到任何关于它的官方文档 - https://github.com/wix/react-native-navigation/issues/130

This issue refers to onDisplay which seems like what I am looking for. However I can't find any official documentation about it - https://github.com/wix/react-native-navigation/issues/130

推荐答案

include this as 'callIfBackToThisRoute'...

include this as 'callIfBackToThisRoute'...

export default ( props, call ) => {
    if( !props.navigation ) throw 'I need props.navigation'
    const thisRoute = props.navigation.state.routeName;
    props.navigation.addListener(
        'willFocus',
        payload => {
            if( payload.state.routeName == thisRoute) call(props)
        }
    );
}

并在您的组件中使用它...

and use it inside your component...

componentDidMount() {
    const { doIt } = this.props;
    doIt()
    callIfBackToThisRoute(
        this.props,
        (props) => doIt()
    )
}

这篇关于使用 react-native-navigation 显示组件时如何触发事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！