Vue.js Parse JSON String
We can use native JavaScript parse() method to parse json string. Here in this tutorial, we are going to explain how you can use this method to parse a string in JavaScript Object in vuejs. You can also use our online editor to edit and run the code online.
Vue.js Parse JSON String – JavaScript Example
You can use parse() method in vuejs simply as below-
Example:
<div id="app">
<p v-if="myObj.firstName">{{myObj.firstName}}</p>
<p v-if="myObj.lastName">{{myObj.lastName}}</p>
<button @click="myFunction()">Click Me</button>
</div>
<script>
new Vue({
el: '#app',
data: {
myJson:'{"firstName":"John", "lastName":"Doe"}',
myObj:{}
},
methods:{
myFunction: function () {
this.myObj = JSON.parse(this.myJson);
}
}
});
</script>
|
Output of above example-
Advertisements
