反应原生渲染组件

Question

我想为登录用户呈现不同的东西。我想向他们展示的内容是从函数返回的。也许我做错了一切，所以我非常感谢你的帮助。 这是视图返回的函数：

async function getchats()
{
  [...]

  var checked = 0
  var towrite = <CategoryCard
  titleText={chats.chatItems[checked].senderName}
  customDescriptionComponent={<Text fontSize={20}>{chats.chatItems[checked].message}</Text>}
  count={1}
  gradientColors={["#FAF9D1", "#EECA66", "#E8B730"]}
  onPress={() => console.log("Working")}
/>;
checked++
  while(checked != chats.chatItems.length)
  {
    towrite+=<CategoryCard
    titleText={chats.chatItems[checked].senderName}
    customDescriptionComponent={<Text fontSize={20}>{chats.chatItems[checked].message}</Text>}
    count={1}
    gradientColors={["#FAF9D1", "#EECA66", "#E8B730"]}
    onPress={() => console.log("Working")}
  />;
  checked++
  }
  return (
    <Root>
      {towrite}
    </Root>
  )
  
}

这是渲染函数：

const YourApp = async () => {
  if(await AsyncStorage.getItem("token") != undefined)
  {
    var users = await getchats()
    return users
  }
    ...
  
}

我收到此错误：

Error: Objects are not valid as a React child (found: object with keys {_U, _V, _W, _X}). If you meant to render a collection of children, use an array instead.

我尝试创建一个数组并将 CategoryCards 放入其中，但我遇到了同样的错误。