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