Vue Js Concat String Method
.jpg)
Vue Js Concat String: Two or more strings can be joined using the concat() method. This approach does not modify the pre-existing string, even though it returns a new string. To merge the strings, use text.concat(text1, text2), or a dot operator such as string1.concat(string2). These methods are immutable since the merge result is kept in a new string. The method for combining strings in vue.js will be covered in this example.




Thanks for your feedback!
Your contributions will help us to improve service.
How to Combine two string in Vue Js?
In Vue.js, we'll use the native javascript method str.concat(str1) on the string, pass one or more parameters, and return a new string
Vue Js concat string example
xxxxxxxxxx
<div id="app">
<button @click="myFunction">click me </button>
<p>Text1:{{text1}}</p>
<P>Text2:{{text2}}</P>
<p>Combined string: {{results}}</p>
</div>
<script type="module">
import { createApp } from 'vue'
createApp({
data()
{
return{
results : '',
text1:'FONTAWESOME',
text2:'ICONS'
}
},
methods:{
myFunction(){
this.results = this.text1.concat(this.text2);
},
}
}).mount('#app')
</script>
Output of above example
How to Join more than two string in Vue Js?
To combine multiple strings and return the new combined string in Vue, use String.concat(text1, text2, text3) as shown below:
Vue js Join two string example
<div id="app">
<button @click="myFunction">click me </button>
<p>Text1:{{text1}}</p>
<P>Text2:{{text2}}</P>
<P>Text3:{{text3}}</P>
<p>Combined string: {{results}}</p>
</div>
<script type="module">
import { createApp } from 'vue'
createApp({
data()
{
return{
results : '',
text1:'Sarkari',
text2:'Naurkri',
text3:'Exams'
}
},
methods:{
myFunction(){
this.results = this.text1.concat(" ",this.text2," ",this.text3);
},
}
}).mount('#app')
</script>
Output of above example