ReactJS - 如何在输入中阻止黑名单

Question

我是React JS的新手，当用户在输入值中插入输入值时，我试图删除输入值，我怎样才能获得数组＆＃34; Blacklist＆＃34;并在键入时更改删除输入中的单词。感谢!!!

＆＃13;

＆＃13;

 class BlackWordInput extends React.Component {
   constructor(props) {
     super(props)
     this.state = {
       place: 'Digite uma palavra!'
     }
   }
   handleVerifyWord(e) {
     if (this.value === blacklist[i]) {
       this.refs.input.value = "";
     }
   }
   render() {
     return ( <
       div >
       <
       input type = "text"
       placeholder = {
         this.state.place
       }
       onKeyUp = {
         this.handleVerifyWord.bind(this)
       }
       />< /
       div >
     )
   }
 }
 class getBlackList extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
       data: []
     };
   }
   getBlackData() {

   }
 }
 const blacklist = [{
   id: 0,
   name: 'Block'
 }, {
   id: 1,
   name: 'Blocker'
 }]

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.min.js"></script>
<div id="blackword"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

夫妻俩：

1. 您应该使用ref或e.target.value来获取输入的文本内容。

2. 您需要检查项目是否存在于数组中的任何位置，而不是if(e.target.value === blacklist[i])。一种方法是if(blacklist.indexOf(e.target.value) > -1)

3. 如果为true，则只应替换要测试的值： e.target.value = e.target.value.replace(blacklist[i], '')。你需要先找出你要删除的单词。