s6e92 components with data method
This commit is contained in:
parent
f0f9acb0eb
commit
74fccdfb14
@ -1,10 +1,13 @@
|
||||
Vue.component('ts-cmp',{
|
||||
Vue.component('ts-cmp', {
|
||||
data() {
|
||||
return {
|
||||
status: "Critical!",
|
||||
};
|
||||
return {status: 'Critical'};
|
||||
},
|
||||
template: '<p> Server status {{ status }} </p>'
|
||||
template: '<p> Server status {{ status }} <button @click="changeStatus">XXX</button></p>',
|
||||
methods: {
|
||||
changeStatus(){
|
||||
this.status = 'Normal';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var app = new Vue({
|
||||
|
@ -8,6 +8,8 @@
|
||||
<body>
|
||||
<div id='app'>
|
||||
<ts-cmp></ts-cmp>
|
||||
<hr>
|
||||
<ts-cmp></ts-cmp>
|
||||
</div>
|
||||
|
||||
<div id='app'>
|
||||
|
Loading…
Reference in New Issue
Block a user