[Vuejs]-Filter and replace banned words Vue js

by

0👍

Here is our vue instance. The watcher replaces the banned word to asterisk (*)

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
	    		}
    		}
    	}
    }
});
<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>
👤Clyde Dexter Santiago

Leave a comment