过滤并替换禁止的单词Vue js

Question

在这种情况下，我们想要过滤输入中的单词：

＆＃13;

＆＃13;

<input type="text" class="form-control" placeholder="Write something..." v-model="todoInput"">

＆＃13;

＆＃13;

＆＃13;

这些是我们想要从输入中替换的禁止词

  

＆＃34;禁止＆＃34;，＆＃34; apple＆＃34;，＆＃34; banana＆＃34;，

Answer 1

这是我们的vue实例。观察者将禁用的单词替换为星号（*）

＆＃13;

＆＃13;

const app = new Vue({
    el: '#app',
    data: function(){
    	return {
    		todoInput : '',
    	}
    },
    watch: {
    	todoInput: function(){
    		var banned = ["banned", "apple", "banana"]
    		for (var i = 0; i < banned.length; i++) {
    			if (this.todoInput.includes(banned[i])) {
	    			this.todoInput = this.todoInput.replace(banned[i], "*".repeat(banned[i].length)) //sets the input to * times the length of the banned word
	    		}
    		}
    	}
    }
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>

<div id="app">

    <input type="text" class="form-control"
            placeholder="Write something..." 
            v-model="todoInput">

</div>

＆＃13;

＆＃13;

＆＃13;