React native 如何将两个文本以左对齐方式放置在行视图中？

我正在尝试实现一个视图，其中包含两个具有不同样式的文本。我有这个：

<View style={{flexDirection:'row'}}>
  <Text style={styles.style1}>
    {text1}
  </Text>

  <Text style={styles.style2}>
    {text2}
   </Text>
</View>

{text1}
{text2}

它显示了如下内容： 但我想做到这一点：

---

如果您只是用文本组件而不是视图来包装它们，它应该可以工作：

<Text>
  <Text style={styles.style1}>
    {text1}
  </Text>

  <Text style={styles.style2}>
    {text2}
   </Text>
</Text>

{text1}
{text2}

如果您只是用文本组件而不是视图来包装它们，它应该可以工作：

<Text>
  <Text style={styles.style1}>
    {text1}
  </Text>

  <Text style={styles.style2}>
    {text2}
   </Text>
</Text>

{text1}
{text2}

说明：
这是我想要实现的文本流的一个示例。

说明：
这是我想要实现的文本流的一个示例。

---

您还可以包括您的样式表吗？您还可以包括您的样式表吗？