2016-08-11 5 views
0

reactjs에서 원시 텍스트 영역 동작을 다시 만들려고합니다. 특히, 사용자가 텍스트 영역의 기존 텍스트 중 일부를 선택/강조 표시 한 다음 선택 영역 위에 새 텍스트를 붙여 넣을 수있게하려고합니다. ReactJS onPaste 이벤트 : 사용자가 일부 텍스트 영역의 기존 내용을 선택했는지 확인하는 방법

나의 현재 반응 onPaste 이벤트 핸들러 : 기존의 텍스트 영역의 내용을 클립 보드의 내용을 추가하지만, 사용자가 텍스트 영역의 일부를 선택했다면, 그 선택이 그것 같이 덮어 쓰기되지 않습니다
onPaste(e) { 
    let existingText = e.target.value; 
    e.clipboardData.items[0].getAsString((str) => { 
     this.setState({ 
      fieldValue: existingText + str 
     }); 
    }); 
} 

할까요.

일부 텍스트 영역 콘텐츠가 선택/강조 표시되었는지 확인하는 방법이 있습니까?

감사합니다.

답변

0

나는

당신은 네이티브 JS 지정한 selectionStart와 selectionEnd에 사용할 수 있습니다

...

onPaste(e) { 
    let existingText = e.target.value, 
     selectStart = e.target.selectionStart, 
     selectEnd = e.target.selectionEnd; 

    e.clipboardData.items[0].getAsString((str) => { 
     let newText = newText = existingText.substring(0, selectStart) + str + existingText.substring(selectEnd, existingText.length); 

     this.setState({ 
      fieldValue: newText 
     }); 
    }); 
} 
그것을 밖으로 :) 생각