reactjs - 使用 BottomTabNavigator 防止在状态更改后重新渲染

Question

每次我按下一个按钮来更改存储在与底部标签导航器链接的两个屏幕的上下文中的状态时，都会记录两次。当我使用堆栈导航器时也会发生同样的情况，如果我在导航到的屏幕中按下 tha 按钮，a 会被记录两次，就好像两个屏幕都重新呈现，即使其中只有一个是可见的。如何防止这种情况发生，只允许重新渲染实际可见的屏幕？

应用程序.js：

const navigator = createBottomTabNavigator(
  {
    Index: IndexScreen,
    Test: tester
  },
  {
    initialRouteName: 'Index', 
  }
);

const App = createAppContainer(navigator);

export default () => {
  return (
    <Provider>
      <App />
    </Provider>
  );
};

IndexScreen.js：

const IndexScreen = () => {
  const { state, ..., increment } = useContext(Context); //... represents some other methods here
  console.log("a");
... //a button that just increments a number stored in state
}

tester.js 的结构类似于 IndexScreen.js 的结构。

标签： reactjsreact-native