如何突出显示每个文本的不同颜色的文本：React

Question

我将突出显示文本，但每个文本都具有不同的颜色（随机颜色）。在我的代码中，我将单击文本数组中的单词，然后将单词单击到textHighlight数组。如果要查看已经是突出显示的文本，请单击“显示突出显示”按钮，然后将状态showHighlight更改为"true"并显示文本突出显示。例如，“示例文本以突出显示”。我单击"Example"和"highlight"，然后在textHighlight数组中像["Example","highlight"]。它将在"Example"中的"highlight"和"Example中显示高亮（随机颜色不同）以突出显示“文本。”现在，我的问题是突出显示是我需要的所有文本的相同颜色突出显示。可以吗？谢谢您的建议。

import React, { Component } from 'react'
import '../App.css'

import Highlighter from "react-highlight-words";

class hightlight extends Component {
    constructor(props) {
    super(props);
    this.state = {
        text: ["Example","Text","to","highlight"],
        textHighlight: [],
        showHighlight: false
    }
}

handleClick = (index) => {
    let highlight = this.state.text[index]
    var randomColor = require('randomcolor');
    this.setState(prevState => ({
        textHightlight: [...prevState.textHighlight,hightlight]
    }))
    this.setState({
        color: randomColor()
    })
}

handleClickShow = () => {
    this.setstate({
        showHighlight: !this.state.showHighlight
    })

    render() {
        let {text,textHighlight,color} = this.state
        return (
            <div>
                <button onClick={this.handleClickShow}>show highlight</button>
                {this.showHighlight == false ?
                    {this.state.text.map((text,index) => {
                        return (
                            <span key={index} onClick={()=>this.handleClick(index)}>{text}</span>
                        )
                     })}
                     :null
                 }
                 {this.showHighlight == true ?
                     {this.state.text.map((text) => {
                        return (
                            <Highlighter                                  
                            highlightClassName="YourHighlightClass"
                            searchWords={textHighlight}
                            autoEscape={true}
                            highlightStyle={{backgroundColor:color}}
                            textToHighlight={text}
                            />
                        )
                     })}
                     :null
                 }
            </div>