Vue Js indexOf method:The Vue.js string indexOf() method is used to search for a specified character within a given string and returns the position of the first occurrence of the character .This method returns -1 if the value is not found. The indexOf() method is case sensitive. This means that it will return -1 if the specified value does not match the string exactly, as indexOf() looks for an exact match.In this tutorial, we’ll show you how to use the string indeOf() method with vue Js to determine the position of a character within a given text. The string indexOf() method in Vue JS allows you to find the position of a specific character within a given text
How to use string indexof in Vue js?
The indexOf() function in Vue Js takes two parameters, a string and a character, and returns the position of the first occurance of the specified character within the given string
Implement string indexof in Vue js
<div id="app">
<p>{{text}}</p>
<p>Search String:{{searchString}}</p>
<button @click="myFunction">click me</button>
<p>Found at: {{results}} position</p>
</div>
<script type="module">
import { createApp } from 'vue'
createApp({
data()
{
return{
text : 'In three months, I learned the Vue Js programming language.',
searchString:'three',
results:''
}
},
methods:{
myFunction(){
this.results = this.text.indexOf(this.searchString);
},
}
}).mount('#app')
</script>
Output of above example
How to get position of character in Vue js ?
Vue.js has a function called indexOf() that allows you to find the position of a character in a string.
Vue Js Search string Position | Example
<div id="app">
<p>{{text}}</p>
<p>Search String:{{searchString}}</p>
<button @click="myFunction">Get Position</button>
<p>Index number:: {{results}}</p>
</div>
<script type="module">
import { createApp } from 'vue'
createApp({
data()
{
return{
text : 'The Vue.js programming language is extremely useful for creating dynamic websites.',
searchString:'programming',
results:''
}
},
methods:{
myFunction(){
this.results = this.text.indexOf(this.searchString);
},
}
}).mount('#app')
</script>