Reactjs 反应未呈现的本机平面列表项

我正在测试一个嵌套在导航器中的平面列表，并试图了解它是如何工作的。下面的代码可以正常工作：

<FlatList
    data={[{key: 'a'}, {key: 'b'}]}
    renderItem={({item}) => <Text>{item.key}</Text>}
    horizontal={true}
/>

{item.key}
水平={true}
/>

但这并不是：

<FlatList
    data={[{key: 'a'}, {key: 'b'}]}
    renderItem={({item}) => <TextComp data={item}/>}
    horizontal={true}
/>

}
水平={true}
/>

TextComp只是一个显示item.key的组件，单独测试时，它可以正常工作。代码是

<View> 
    <Text>{this.props.data.key}</Text> 
</View> 

{this.props.data.key}

我还尝试在两个组件周围绘制边框，似乎平面列表确实在渲染，但项目没有

我正在安卓设备上测试

---

更新：我在TextComp组件中添加了console.log（this.props）语句，它正确地显示了props，因此正确的数据正在从平面列表传递到TextComp，但是TextComp没有得到渲染

在我比较了Marcel Kalveram的代码和我的代码后，他得到了解决方案。事实证明，要在平面列表中正确渲染项目，需要有高度和宽度。我对此的解释是，需要项目的尺寸来在平面列表中正确地调整项目的尺寸。类似地，项的维度不能是百分比，因为其父项是一个平面列表，它本身具有不同的维度。因此，我的问题的解决方案是向项目组件添加宽度和高度样式属性。为了让它自动调整大小，我使用了内置的React原生维度。

你能分享

TextComp

的代码吗？{this.props.data.key}对我来说似乎工作正常：。您能否发布完整的代码示例或帮助我们重现问题的小吃？您是否在

TextComp

组件中添加了返回语句？例如：

const TextComp=（）=>{return（…）}

@Nerdragen当我要求

TextComp

的代码时，我要求的是完整的代码，在这种情况下，组件内部的一切都非常重要（如何处理道具以及如何返回组件），只显示

{props.text}

根本没有用处，因此，只有在您可以的情况下，请共享组件的完整代码，以便更好地了解可能出现的故障。