时间戳

首页 > 解决方案 > 使用 syncfusion-react 文档编辑器查找第二次出现的文本。（Javascript）

javascript - 使用 syncfusion-react 文档编辑器查找第二次出现的文本。（Javascript）

问题描述

需要使用同步融合文档编辑器找到文本的第二次出现并以红色突出显示文本。

根据他们有 findAll() 方法的文档，它在整个文档中查找文本并以黄色突出显示。无论如何我可以自定义突出显示颜色并在文档中仅找到第二次出现？

replaceAll() {
    let textToFind = document.getElementById('find_text').value;
    let textToReplace = document.getElementById('replace_text').value;
    if (textToFind !== '') {
        // Find all the occurences of given text
        this.documenteditor.searchModule.findAll(textToFind);
        if (this.documenteditor.searchModule.searchResults.length > 0) {
            // Replace all the occurences of given text
            this.documenteditor.searchModule.searchResults.replaceAll(textToReplace);
        }
    }
}
render() {
    return (<div>
            <button onClick={this.replaceAll.bind(this)}>Replace All</button>
            <DocumentEditorComponent id="container" ref={(scope) => { this.documenteditor = scope; }} isReadOnly={false} enableSelection={true} enableEditor={true} enableSearch={true}/>
        </div>);
}

标签： javascriptreactjssyncfusion

解决方案

关于自定义搜索结果

文档编辑器的最新版本 (17.4.49) 提供了自定义搜索突出显示颜色的选项。请参考以下示例代码

this.settings = { searchHighlightColor:'red' };

DocumentEditorContainerComponent id="container" ref={(scope) => { this.container = scope; }} style={{ 'display': 'block', 'height': '590px' }} documentEditorSettings={this.settings} enableToolbar={true} locale='en-US'/>

发行说明

https://ej2.syncfusion.com/react/documentation/release-notes/17.4.49/#document-editor

这有助于您自定义搜索结果的突出显示颜色

推荐阅读