return 值并将其打印在 <Text> 组件中

Question

有这个功能

const IsFollowing = async (followID) =>{
  const { data:follow } =await client.query({
    query: QUERY2,
    variables: {
      user_id: userID,
      follow_id: followID
    },
    fetchPolicy: 'network-only',
  });
  console.log('RESPONSE', JSON.stringify(follow, null, 2));
  return follow.isFollowing
}

只有 return true 或 false 我想得到这个值并在这样的文本组件中使用它

<Text style={tailwind('text-sm text-blue-500')}>{IsFollowing(item.item._id) == true ? 'Unfollow' : 'Follow'}</Text>

但无论如何，它总是 return 只为真，即使函数中的值为假

Answer 1

该函数是 async，这意味着它 return 是一个承诺。您没有按照您描述的方式使用 return 承诺值。即使你这样做了，你也不应该在渲染中产生副作用（例如数据获取）。 useEffect 就是为了那个。

因此您可以将该函数 IsFollowing 移动到 useEffect 中（ 具有正确的依赖关系 ），然后更新状态中的布尔变量。然后根据该布尔变量，您可以决定是渲染 follow 还是 unfollow.

return 值并将其打印在 <Text> 组件中

return value and print it in <Text> Component

function

promise

reactjs

react-native