javascript - 屏幕挂载后如何调用函数？

Question

在主屏幕中，我有一个函数可以从 API 获取“用户类型:付费/未付费”，

因此，在这个屏幕中，我里面有一个抽屉，用户可以导航到登录屏幕，因此在用户登录后，我将他导航回主屏幕

但是在这种情况下，主屏幕已经安装，这意味着 userIsPaid 函数已经被第一次调用，所以我想再次“调用 userisPaid()”重新检查该帐户是否已付款？

因为在底部选项卡中，我根据用户类型有条件地呈现一个新选项卡，但它不起作用，因为我没有重新检查用户类型。

代码

根.js

const BottomTabStack = createBottomTabNavigator();
function BottomTabs() {
  const isPaid = useSelector(state => state.userIsPaid.isPaid);

...
 <BottomTabStack.Navigator
      lazy={false}
      tabBar={props => <TabBar {...props} />}
      >
...
 {isPaid && (
        <BottomTabStack.Screen
          name="Library"
          component={YourLibraryStackScreen}
        />
      )}
    </BottomTabStack.Navigator>
}

Home.js

  userIsPaid = async () => {
    try {
      const {token} = this.props;
      let AuthStr = `Bearer ${token}`;
      let response = await API.get('/profile', {
        headers: {Authorization: AuthStr},
      });
      const {account} = response.data.data;
      console.log('account??', account);
      account === 'unpaid'
        ? this.props.isUserPaid(false)
        : this.props.isUserPaid(true);
    } catch (err) {
      console.log(err);
    }
  };

componentDidMount() {
    const {token} = this.props;
    token && this.userIsPaid();
 }

登录.js

  sendData = async data => {
    // this.setState({loading: true});
    try {
      let response = await API.post('/google', data);
      // this.setState({loading: false});
      let {
        data: {
          data: {
            response: {token},
          },
        },
      } = response;

      this.props.dispatch(saveToken(token));
      this.props.dispatch(isLoginFunc(true));
      this.props.navigation.push('BottomTabNavigator'); // bottom navigation 'home,about....'
    } catch (err) {
      console.log(err);
    }
  };

Answer 1

使用 shouldComponentUpdate() 生命周期方法 mybe 很有用。 使用 shouldComponentUpdate() 让 React 知道组件的输出是否不受 state 或 props 中当前更改的影响。默认行为是在每次状态更改时重新渲染，并且在绝大多数情况下，您应该依赖默认行为。

当接收到新的 props 或 state 时，

shouldComponentUpdate() 在渲染之前被调用。默认为true。初始渲染或使用 forceUpdate() 时不会调用此方法。