javascript - 在文本中加粗特定单词-React Native？

我需要替换based on the index value的地方的boldText {index}，并且该词应为粗体。

例:

 {
  sentence: {0} and {1} are great
  boldText: ['You', 'Your Family']
 }

输出:

您的和您的家人很棒。

最佳答案

这是一个简单的示例。

希望对您有所帮助!

const sample = {
  sentence: '{0} and {1} are great',
  boldText: ['You', 'Your Family']
};

const applyBoldStyle = text => text.sentence.replace(/\{(\d+)\}/g, (match, i) => `<b>${text.boldText[i]}</b>`);

console.log(applyBoldStyle(sample));

请注意，您可以传递任何您想适合本机传递的信息。在这里，我通过带有<b>标记的简单HTML，这里重要的是replace函数。使它返回您想要的任何内容。

使用react-native，您可能需要使用以下内容:

const sample = {
  sentence: '{0} and {1} are great',
  boldText: ['You', 'Your Family']
};

const applyBoldStyle = text => {
  let numberOfItemsAdded = 0;
  const result = text.sentence.split(/\{\d+\}/);
  text.boldText.forEach((boldText, i) => result.splice(++numberOfItemsAdded + i, 0, <Text style={{fontWeight: 'bold'}}>{boldText}</Text>););
  return <Text>{result}</Text>;
};