Vue js Array includes function

Vue js array includes method : In the Include event, it is defined that if a specific value is present in the array, then it will return true, and if the value is not present, then it will return false. Include method is also case sensitive.In this article, we'll go over how to use vue js to determine whether a given item is part of an array.

written

reviewed

updated

You can check array value in vue.js simply as below-

To see if an array in Vue.js contains a value, use the javascript includes method.

Vue js array includes Example True

<div id="app" class="container">
   <P>Country : {{array}}</P>
   <button @click='myFunction' class='btn btn-primary'>check country exist</button>
   <p></p>
   <p>{{result}}</p>
</div>
<script type="module">
  import { createApp } from 'vue'
  createApp({
  data()
   { 
    return{ 
      array : ['India','Australia','America','England'],
      result : ''
     } 
   }, 
    methods:{ 
        myFunction(){ 
            this.result = this.array.includes("America"); 
           }
        }
      }).mount('#app')
  </script>

xxxxxxxxxx
 
<div id="app" class="container">
   <P>Country : {{array}}</P>
   <button @click='myFunction' class='btn btn-primary'>check country exist</button>
   <p></p>
   <p>{{result}}</p>
</div>
<script type="module">
  import { createApp } from 'vue'
  createApp({
  data()
   { 
    return{ 
      array : ['India','Australia','America','England'],
      result : ''
     } 
   }, 
    methods:{ 
        myFunction(){ 
            this.result = this.array.includes("America"); 
           }
        }
      }).mount('#app')
  </script>

Run

Using position 5 as a starting point for the search in Vue js

Using the includes method in vue js, search through an array Example false.

      <div id="app" class="container">
        <P>Subject : {{subject}}</P>
        <button @click='myFunction' class='btn btn-primary'>check subject</button>
        <p></p>
        <p>{{result}}</p>
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         subject : ['Hndi','Math','English','Physics','Computer Sciemce','Biology'],
         result : ''
        } 
     }, 
     methods:{ 
         myFunction(){ 
            this.result = this.subject.includes("Math",5); 
           }
        }
      }).mount('#app')
  </script>

xxxxxxxxxx
 
      <div id="app" class="container">
        <P>Subject : {{subject}}</P>
        <button @click='myFunction' class='btn btn-primary'>check subject</button>
        <p></p>
        <p>{{result}}</p>
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         subject : ['Hndi','Math','English','Physics','Computer Sciemce','Biology'],
         result : ''
        } 
     }, 
     methods:{ 
         myFunction(){ 
            this.result = this.subject.includes("Math",5); 
           }
        }
      }).mount('#app')
  </script>

Run

The string includes() function runs a case-sensitive search to see if one string can be found inside another, returning true or false

Vue js string includes method Example

      <div id="app" class="container-fluid">
        <P>Paragarph : {{text}}</P>
        <button @click='myFunction' class='btn btn-primary'>Search String </button>
        <p></p>
        <p>{{result}}</p>
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         text : 'India won both the 1983 and 2011 ODI World Cup.',
         result : ''
        } 
     }, 
     methods:{ 
         myFunction(){ 
            this.result = this.text.includes("2011"); 
           }
        }
      }).mount('#app')
  </script>

xxxxxxxxxx
 
      <div id="app" class="container-fluid">
        <P>Paragarph : {{text}}</P>
        <button @click='myFunction' class='btn btn-primary'>Search String </button>
        <p></p>
        <p>{{result}}</p>
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         text : 'India won both the 1983 and 2011 ODI World Cup.',
         result : ''
        } 
     }, 
     methods:{ 
         myFunction(){ 
            this.result = this.text.includes("2011"); 
           }
        }
      }).mount('#app')
  </script>

Run

VueJs Tutorial

Vue js Array includes function

Feedback for Abhishek

You can check array value in vue.js simply as below-

Vue js array includes Example True

Using position 5 as a starting point for the search in Vue js

Using the includes method in vue js, search through an array Example false.

The string includes() function runs a case-sensitive search to see if one string can be found inside another, returning true or false

Vue js string includes method Example