如何在Text标签内将对象转换为可正常渲染的JSX组件

你错误地将<Text>组件嵌入了ES6模板字符串的插值语法${}中，模板字符串处理非字符串类型的对象时，会自动调用其toString()方法，React组件本质是JS对象，最终渲染就会输出[Object]。

React Native本身支持<Text>组件直接嵌套，不需要将所有内容包裹在模板字符串里，直接把文本和子Text组件作为父Text的子元素排列即可：

<Text style={styles.descText}>
    All reports size is
    <Text style={styles.downloadSize}>
        {bytesToSize(this.props.downloadSize)} 
    </Text>
    Text to display
</Text>

• 模板字符串仅适用于拼接纯文本内容，不要在其中插入JSX组件
• 如果需要手动控制文本换行，可在对应位置插入{'\n'}实现，不需要在模板字符串中写换行符

内容的提问来源于stack exchange，提问作者Phaoga54