高亮显示文本字符串中给定字符串的出现位置。将每个匹配项包裹在 <mark> 标签 中,该标签提供浏览器默认样式。

用法

传入 text 和需要匹配的 highlight 字符串。

在下面的示例中,字符串 Gutenberg 会被高亮两次。

import { TextHighlight } from '@wordpress/components';

const MyTextHighlight = () => (
    <TextHighlight
        text="Why do we like Gutenberg? Because Gutenberg is the best!"
        highlight="Gutenberg"
    />
);

属性

该组件接受以下属性。

highlight: string

要在 text 中搜索并高亮的字符串。不区分大小写。支持多个匹配项。

  • 必填:是
  • 默认值:''

text: string

用于检测是否包含给定 highlight 的文本字符串。

  • 必填:是
  • 默认值:''