reactjs React Native文本脚本解析

chhkpiq4 于 2023-05-17 发布在 React

关注(0)|答案(1)|浏览(106)

有没有一种方法可以动态地将react原生脚本注入到代码中。
动态生成的脚本如下：

<Text><Text styles={{ fontSize: 30, fontWeight: 'bold'}}>Two Color Options</Text></Text><Text> <Text><Text styles={{ fontSize: 30, fontWeight: 'bold'}}>Stone Grey</Text>- Great for new...  </Text>

并且需要在react-native应用程序中像文本组件一样显示它。
我尝试了react-jsx-parser，但它并不像预期的那样工作。
感谢任何帮助！

reactjs

来源：https://stackoverflow.com/questions/72364569/react-native-text-script-parsing

1条答案

按热度按时间

tjjdgumg1#

您可以将动态文本添加到作为<Text>组件的子级提供的字符串中。例如：

const dynamicText = 'option1'

return (
   <>
      <Text styles={{ fontSize: 30, fontWeight: 'bold'}}>Two Color Options</Text>
      <Text>{dynamicText}</Text>
   </>
)

如果dynamicText可以未定义，则可以使用以下语法

const dynamicText = 'option1'

return (
   <>
      <Text styles={{ fontSize: 30, fontWeight: 'bold'}}>Two Color Options</Text>
      {!!dynamicText && <Text>{dynamicText}</Text>}
   </>
)

这里的文本只会在dynamicText被评估为true时显示。所以它不是undefined、null或''（空字符串）。
!!语法将该值转换为布尔值。如果没有它，''将返回falsy，并将被添加到组件中。这会给出一个错误，因为React Native不允许字符串不在<Text>组件中呈现。

赞(0）回复(0）举报 2023-05-17

我来回答

reactjs React Native文本脚本解析

1条答案

相关问题

热门标签

最新问答