How to Replace String in Vue JS?
In example, i will show you how to replace string in vuejs. we will replace string using jquery replace function. we will use jquery code replace function to replace word form string in vue.js.
Below simple example to replace string "Welcome to ItSolutionStuff.com" into "Welcome to HDTuto.com". It is a very simple and basic, so you can easily understand it.
Example:
<!DOCTYPE html>
<html>
<head>
<title>How to replace string in Vue JS? - ItSolutionStuff.com</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<div id="myId" ref="myId">{{ message }}</div>
<button @click="myFunction()">Click Me</button>
</div>
</body>
<script type="text/javascript">
new Vue({
el: '#app',
data: {
message:"Welcome to ItSolutionStuff.com"
},
methods:{
myFunction: function () {
this.message = this.message.replace("ItSolutionStuff.com", "HDTuto.com");
}
}
});
</script>
</html>
I hope it can help you...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- How to Use Ternary Operator in Vue JS?
- How to Define Global Variables in Vue JS?
- Vue JS Ajax Form Submit Example Code
- Vue JS Toggle Switch Button Example
- Vue Toastr Notifications Example Code
- How to Create and Use Component in Vue JS Cli?
- How to Open a Link in a New Tab in Vue JS?
- How to Use setTimeout Function in Vue JS?
- How to Check Object or Array Empty or Not in Vue JS?
- How to Get Element by ID in Vue JS?
- Laravel Vue Router Example From Scratch
- Laravel Vue Flash Message Example From Scratch
- Laravel Vue JS File Upload Using Vue-dropzone Example