javascript，分割字符串，並顯示一個單詞的大膽

Question

我有一個字符串，我想要顯示它的粗體字。

this.splitSentence(exercise.sentence,boldWordIndex) 

所以我決定把字符串分成3部分;在粗體字，粗體字之前和之後。 所以我定義瞭如下功能。但我在加入時遇到問題，中間有三個詞沒有空格。而且我認爲應該有更好的方法。

splitedSentence(sentence,index) { 
     var splitedSentece = sentence.split(" "); 
     var slice1=splitedSentece.slice(0,index); 
     var slice2=splitedSentece.slice(index,index+1); 
     var slice3=splitedSentece.slice(index+1,splitedSentece.length); 
     return [slice1.join(" "),slice2.join(" "),slice3.join(" ")]; 
} 

obs！我在一個反應​​應用

Answer 1

寫這個，我希望這是你在找>>fiddle：

class Example extends React.Component { 
    constructor(){ 
    super(); 
    this.state = { 
     word: '' 
    } 
    this.change = this.change.bind(this) ; 
    } 
    change(e){ 
    this.setState({ [e.target.name]: e.target.value}); 
    } 
    render(){ 
    const index = this.props.sentences.split(' ').indexOf(this.state.word); 
    const sentences = this.props.sentences.split(' ').map((item, key) => { 
     // index may come from server 
     return <Word classN={index === key ? 'foo' : ''} key={key} text={item} /> 
    }); 

    return <div> 
     <input name='word' type='text' onChange={this.change}/> <br/> 
      {sentences} 
    </div> 
    } 
} 

class Word extends React.Component { 
    render(){ 
    return <span className={this.props.classN}>{` ${this.props.text} `}</span> 
    } 
} 

React.render(<Example sentences={'Hello World from ReactJS'}/>, document.getElementById('container'));