如何在 ReactJS 中用另一个和不同颜色替换一个字符串？

Question

I have a string mapped from an array and I have used a regexp to return particular text. I want this particular text to have a different color when it is rendered. However the current approach fails as it wont let me just set the style of the string in pure javascript. Is there a way around fixing this so the replace can work with the new text as a different colour.

Ideally, the final outcome would look like this

@user This is text

Whereby @user is blue and the rest is black

{this.state.dataReplies.map((n, i) => {
            var re = /@(\S+)\b/g;
            let oldstr = n.description.match(re);
            console.log(oldstr);
            let newstr = oldstr.style.colour = "#0066ff";
            let str = n.description.replace(oldstr, newstr);
    return (
      <p>{str}</p>
    );
})}

Answer 1

Thanks to @Jayce444 for the solution:

{this.state.dataReplies.map((n, i) => {
            var re = /@(\S+)\b/g;
            let oldstr = n.description.match(re);
            let str = n.description.replace(oldstr, "");
    return (
      <p> <span style={{color: "#0066ff"}}>{oldstr}</span> {str}</p>
    );
})}