如何用 React Link 组件替换部分字符串 [英] How to replace parts of a string with React Link component

问题描述

我有一个这样的文本(随机文本):

I have a text (random text) like this one:

bla bla bla (name of link)[link] bla bla bla (name of link)[link]

我需要用 Link React 组件替换所有的 (name of link)[link]:

I need to replace all of (name of link)[link] with Link React component:

<Link to={link}>name of link</Link>

我想看到的:

bla bla bla <Link to='/testRoute'>Test name</Link> bla bla bla <Link to='/testRoute'>Test name</Link>

正文中的

(name of link)[link]可以省略，可以多次见面.

(name of link)[link] in the text can be absent, and can meet many times.

如何替换文本中的所有匹配项?

How can I replace all matches by in the text?

任何帮助将不胜感激.

推荐答案

你必须使用 regexify-string (npm)

npm install --save regexify-string

npm install --save regexify-string

regexifyString({
        pattern: /\[.*?\]/gim,
        decorator: (match, index) => {
            return (
                <Link
                    to={SOME_ROUTE}
                    onClick={onClick}
                >
                    {match}
                </Link>
            );
        },
        input: 'Some initial string with [link]',
    });

这篇关于如何用 React Link 组件替换部分字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！