时间戳

首页 > 解决方案 > 在本机反应中制作个人资料

reactjs - 在本机反应中制作个人资料

问题描述

我是一名 java 开发人员，试图学习如何制作配置文件（对于已登录的用户和登录用户可以看到的其他用户）以做出本机反应，我想知道最好的方法是什么关于这个是。我的直觉是制作一个包含描述、名称等字段的配置文件对象，但似乎这不是反应的理想方式。提前致谢

标签： reactjsreact-nativestate

解决方案

我不确定我是否理解你的问题，当我想创建个人资料屏幕时我会怎么做？

  1. 首先，我会考虑一些状态管理，例如 redux，以通过其他屏幕/组件获取状态
  2. 用于保存的异步存储让我们说令牌如果用户已登录，通过 redux reducer 我可以像这样启动变量：

已记录：假

每次用户登录时，这个变量都会改变。你可以为用户创建一个具有属性的模型，但是当你从 JSON 中的某些 API 获取它时，它就没有必要了那么我将如何编写配置文件屏幕：

const ProfileScreen = props => {
  const user = useSelector(state => state.users.user);
  const fetchUser = useSelector(state => state.users.fetchUser);
  const UserId = props.navigation.getParam('id');

  const dispatch = useDispatch();
  useEffect(() => {
    const loadUser = async () => {
      try {
        setIsLoading(true);
        await dispatch(usersActions.fetchUserData(UserId));
        setIsLoading(false);
      } catch (err) {
        setError(err.message);
      }
    };
    loadUser();
  }, [UserId]);

  return (
    <View style={styles.container}>
      <Text> Name: {fetchUser.name}</Text>
    </View>
  );
};

解释：

  • 变量用户 - 从 redux reducer 获取状态，因此它的用户登录信息，如果你想稍后检查 fetcheduser === user 那么你显示编辑按钮等。
  • 变量 fetchUser - 我们希望在个人资料页面上看到的用户
  • 我们从带有导航的父道具中获得的变量 UserId
  • 然后我们使用 useEffect 在启动时触发，当 userId 发生变化时，方法 fetchUserData 正在为用户获取数据，然后保存到 redux 中的状态，然后我们可以获得他的用户名等。

在渲染方法中，我们只显示用户详细信息

如果您想检查用户是否已登录以显示某些通知，那么您可以通过渲染执行以下操作：

<View style={styles.container}>
  {isLogged && <Text> user is logged in show him something</Text>}
</View>

推荐阅读