首页 > 解决方案 > react-native:重新渲染后字母消失在react-native的当前页面上

问题描述

移动页面后显示通过axios接收到的数据成功。但是当它被重新渲染时,这些字母就消失了。我不知道是哪一个问题。

const MyPage = ({ navigation, info }) => {
  const [userInfo, setUserInfo] = useState();
  const getData = async () => {
    try {
      axios
        .get(
          "http://everyweardev-env.eba-azpdvh2m.ap-northeast-2.elasticbeanstalk.com/api/v1/user"
        )
        .then((res) => res)
        .then((data) => {
          setUserInfo(data.data.data.result);
        })
        .catch((err) => console.log(err));
    } catch (error) {}
  };
  useEffect(() => {
    const unsubscribe = navigation.addListener("focus", () => {
      getData();
    });
    return unsubscribe;
  }, [navigation]);

 
  return (
    <View style={styles.container}>
      {/*프로필*/}
      <View style={styles.profileContainer}>
        <Image source={require("../../images/profile.png")} />
        <View style={styles.profileName}>
          <TouchableHighlight>
            <>
              <Text
                style={{
                  fontWeight: "bold",
                  marginBottom: hp("1%"),
                  fontSize: wp("7%"),
                }}
              >
                {userInfo?._name} 님
              </Text>
              <Text
                style={{
                  fontSize: wp("5%"),
                }}
              >
                {userInfo?._mail}
              </Text>

页面移动后

在此处输入图像描述

重新渲染后 在此处输入图像描述

标签: react-nativeletterviewdiddisappear

解决方案


我认为您的情况并非re-rendering如此refreshing

有什么不同?
re-rendering更新状态后发生。
refreshing在编辑器中编辑文件后发生。

如果您的情况真的refreshing不用担心它只是development在调试构建期间发生,而不是在发布构建中发生。


推荐阅读