React Native 每次打开屏幕时重新呈现组件，响应本机

nom7f22z 于 2023-01-09 发布在 React

关注(0)|答案(1)|浏览(118)

我对React Native有点陌生。我在我的屏幕MyFamily上使用getFamily()，但当我转到另一个屏幕时，更改了Family的值，然后返回到我的MyFamily屏幕，然后我看不到更改。我尝试使用useEffect，但仍然没有任何React，日志也没有发生。我该如何解决这个问题？

export default function MyFamily({ navigation, props, person, inheritors }) {
  console.log(getFamily());

  let [family, setFamily] = useState(getFamily());

  useEffect(() => {
    console.log(getFamily());
    setFamily(getFamily());
  }, [getFamily]);

在我再次设置系列的屏幕中，我执行以下操作：我知道这是正确的，因为显示的Json显示了更新后的值。

import { setFamily } from '../../utilities/family';
setFamily(responseJson.family);

这就是家庭的形成方式：

let family = '';
export default family;
export function getFamily() {
  return family;
}
export function setFamily(f) {
  family = f;
}

react-native

来源：https://stackoverflow.com/questions/75032617/re-render-component-everytime-screen-is-opened-react-native

1条答案

按热度按时间

gcuhipw91#

React实际上并不知道getFamily函数返回的值会改变每个渲染，在useState函数中，它只在初始状态下使用。并且useEffect函数永远不会重新运行，因为getFamily函数本身永远不会更改和重新触发useEffect。您必须更改getFamily()函数以使用"s存储在父组件中，并将其作为属性传递到MyFamily组件中。
例如：

// the parent component that renders the MyFamily screen
function Router() {
  const [family, setFamily] = useState('')

  return (
    <Navigator>
    <Screen component={<MyFamily family={family} setFamily={setFamily} />
    <Screen component={<OtherComponent family={family} setFamily={setFamily} />
    </Navigator>
  }
  )
}

然后从MyFamily开始：

function MyFamily({ family }) {
  console.log(family); // this should be updated
}

并且从OtherComponent：

function OtherComponent({ setFamily }) {
  return (<Button onClick={() => setFamily('newFamily')>Change family</Button>)
}

赞(0）回复(0）举报 2023-01-09

我来回答

React Native 每次打开屏幕时重新呈现组件，响应本机

1条答案

相关问题

热门标签

最新问答