Vue.js Array Filter
This method is used to create an array which is filled with elements that pass the test based on function passed. Here in this tutorial, we are going to explain how you can use this function in vuejs. You can use our online editor to edit and run the code online.
Vue.js Array Filter Method Example
You can use array filter function in vue.js simply as below-
Example:
<div id="app">
<p>item 1 = {{ item1 }}</p>
<p>item 2 = {{ item2 }}</p>
<button @click="myFunction()">Click Me</button>
</div>
<script>
new Vue({
el: '#app',
data: {
item1:['12', '10', '9','5', '6', '4'],
item2:[]
},
methods:{
myFunction: function () {
this.item2 = this.item1.filter(this.checkNum);
},
checkNum:function(num){
if(num > 9){
return num;
}
}
}
});
</script>
|
The above example will return the array based on filter function. For example we have created checkNum function to check whether the array value is greater than 9. It will return an array with values greater than 9.
Output of above example-
Advertisements
