我正在尝试在 react 中制作一个文本编辑器。有谁知道如何从 textarea 中获取选定的文本,以便可以在选定的文本上应用样式。我知道我们可以在 javascript 中使用 window.getSelection 但我很想知道如果有任何其他方法可用于此功能?
如何在react中从文本区域获取选定的文本?
IT技术
reactjs
textarea
                    2021-05-24 10:27:20
                
                    
                
            
        2个回答
            是的,有一种方法可以做到这一点,特别是在 React 中。实现这一目标的方法如下。
第 1 步:- 在 textarea ui 元素中使用 ref。喜欢
     `<textarea
           className='html-editor'  
           ref='myTextarea' 
          value = {this.state.textareaVal}
          onChange={(event)=>{
                      this.setState({
                         textareaVal:event.target.value;
                      });
                   }}
       >
      </textarea>` 
第 2 步:- 现在您可以使用 react refs 访问 DOM 元素。
    let textVal = this.refs.myTextarea; 
第 3 步:- 使用 selectionStart 和 selectionEnd :- 使用 selectionStart 和
         selectionEnd 您可以了解
         所选文本的开始和结束指针。
        let cursorStart = textVal.selectionStart;
        let cursorEnd = textVal.selectionEnd;
现在您有了所选文本的开始和结束索引。
第 4 步:- 使用 javascript 子字符串函数来获取选定的文本。
    this.state.textareaVal.substring(cursorStart,cursorEnd)