在字符串之间使用标签<mark>

时间:2019-03-30 13:09:09

标签: javascript reactjs

我有一个包含包含String的变量searchString。 我必须列出titles我要通过searchString过滤的内容。 我尝试使用标签<mark>突出显示一个标题,但还不能做到这一点。

我尝试实现一个具有2个arg的函数,并为渲染返回一个jsx。

const markString = (title, searchString) => {
  var regex = new RegExp(searchString, 'i');
  const newString = string.replace(regex, '<mark>Banana</mark>');
  console.log(newString);
  return (newString);
};

情况。 searchString = ab title = abracadabra

我希望函数返回类似的内容。 <mark>ab</mark>racad<mark>ab</mark>ra

我需要一个带字符串和世界之间标记标记的jsx。

有人可以帮助我吗?

1 个答案:

答案 0 :(得分:1)

使用split()join()

您可以按标题split() join()和附加<mark>标签let str = 'abracadabra'; function markString(title, searchString){ return searchString.split(title).join(`<mark>${title}</mark>`); } console.log(markString('ab',str))

let str = 'abracadabra';

function markString(title, searchString){
  return searchString.replace(new RegExp(title,"g"),`<mark>${title}</mark>`)
}
console.log(markString('ab',str))

使用RegExp

var_dump()