I used the UML class diagram for java class but this time, I am developing a web application that uses a single file component.
I am asking how can we get a class diagram for this Vue js component. How about the watch and computed?
var vm = new Vue({
el: '#demo',
data: {
message: "xy",
firstName: 'Foo',
lastName: 'Bar',
fullName: 'Foo Bar'
},
watch: {
firstName: function (val) {
this.fullName = val + ' ' + this.lastName
}
},
computed: {
reversedMessage: function () {
return this.message.split('').reverse().join('')
}
},
methods: {
reverseMessage: function () {
return this.message.split('').reverse().join('')
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<p> {{ fullName }}</p>
<p>message: {{ reversedMessage }}</p>
</div>