Reactjs 如何在React中添加动态创建的链接

当我尝试将链接作为参数传递时，它会给出[Object Object]，因为它是字符串连接

当用户单击链接时，他/她应该导航到页面

消息正在这里以渲染方式传递

   moveToListSuccess = (listMovedTo, listMovedId) => {
    const link = <a href={`/mylist?id=${listMovedId}`}>{listMovedTo}</a>;
    this.showTopMessage('success', `1 item successfully moved to ${link}`);
    this.getSavedListAction();
}

showTopMessage = (type, message) => {
    this.setState({
        showMessage: true,
        message,
        type,
    });
}

---

模板文本采用基元类型。它不能很好地处理对象

要解决问题，请使用第三个参数并传递link对象

可以按如下所示进行渲染

moveToListSuccess = (listMovedTo, listMovedId) => {
    const link = <a href={`/mylist?id=${listMovedId}`}>{listMovedTo}</a>;
    this.showTopMessage('success', "1 item successfully moved to ",link );
    this.getSavedListAction();
}

showTopMessage = (type, message,link) => {
    this.setState({
        showMessage: true,
        message,
        type,
        link
    });
}

---

如果您想像字符串变量一样在中显示HTML标记。你可以使用这个库来呈现你的字符串html

{showMessage && <div className={cx('topLevelMessage')}>
    <MessageBox showIcon={false} hasClose type={type} level="section" onClose={this.closeMessageBox}>
        <span>{message} {link}</span>
    </MessageBox>
</div>}

---

你想达到什么目标？请提供更多信息。你能详细说明你的问题吗。这是非常不明确的细节@Arseniy-II@vini模板文本采用基元类型。它不能很好地处理对象。

{showMessage && <div className={cx('topLevelMessage')}>
    <MessageBox showIcon={false} hasClose type={type} level="section" onClose={this.closeMessageBox}>
        <span>{message} {link}</span>
    </MessageBox>
</div>}

import renderHTML from 'react-render-html';

{showMessage && <div className={cx('topLevelMessage')}>
   <MessageBox showIcon={false} hasClose type={type} level="section" onClose={this.closeMessageBox}>
       <span>{renderHTML(message)}</span>
   </MessageBox>
</div>}