ReactJS onChange阻止用戶繼續輸入

Question

有沒有一種方法可以在單詞限制超過時停止用戶輸入。

目前我有一個textarea和e.preventDefault();的變化。但它似乎並沒有阻止用戶輸入。無論如何都可以實現這一點，我知道你可以addEventlister爲keypress並防止默認。但reactJS如何實現相同的功能？

在jQuery中:(我如何在reactJS中實現相同）？

$(function(){ 
    $('textarea').keypress(function() { 
     var l = $(this).val().split(' '); 
     if(l.length > 50){ 
     return false; 
     } 
    }) 
    }) 

Answer 1

在反應可以使用onKeyPress事件並使用.preventDefault，.stopPropagation方法，這樣

var Component = React.createClass({ 
    handleKeyPress: function(e) { 
     var value = e.currentTarget.value.split(' '); 

     if (value.length > 10) { 
      e.preventDefault(); 
      e.stopPropagation(); 
     } else { 
      console.log(value); 
     } 
    }, 
    render: function() { 
     return <textarea onKeyPress={ this.handleKeyPress }></textarea>; 
    } 
}); 

Example

return false從jQuery事件處理程序內是有效的與調用兩個e.preventDefault和e.stopPropagation

Answer 2

<textarea maxLength={10}/>怎麼樣？

http://www.w3schools.com/tags/att_input_maxlength.asp