s6e93 components locally and globally
This commit is contained in:
parent
74fccdfb14
commit
1f786d3e39
@ -1,4 +1,4 @@
|
|||||||
Vue.component('ts-cmp', {
|
var component = {
|
||||||
data() {
|
data() {
|
||||||
return {status: 'Critical'};
|
return {status: 'Critical'};
|
||||||
},
|
},
|
||||||
@ -8,9 +8,26 @@ Vue.component('ts-cmp', {
|
|||||||
this.status = 'Normal';
|
this.status = 'Normal';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
};
|
||||||
|
|
||||||
var app = new Vue({
|
var component2 = {
|
||||||
el: '#app',
|
template: '<span>butts</span>',
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
var app1 = new Vue({
|
||||||
|
el: '#app1',
|
||||||
|
components: {
|
||||||
|
'ts-cmp': component
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var app2 = new Vue({
|
||||||
|
el: '#app2',
|
||||||
|
components: {
|
||||||
|
'ts-cmp': component2
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
@ -6,13 +6,16 @@
|
|||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="style.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id='app'>
|
<div id='app1'>
|
||||||
<ts-cmp></ts-cmp>
|
<ts-cmp></ts-cmp>
|
||||||
<hr>
|
<hr>
|
||||||
<ts-cmp></ts-cmp>
|
<ts-cmp></ts-cmp>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id='app'>
|
<div id='app2'>
|
||||||
|
<ts-cmp></ts-cmp>
|
||||||
|
<hr>
|
||||||
|
<ts-cmp></ts-cmp>
|
||||||
</div>
|
</div>
|
||||||
<script src="app.js" charset="utf-8"></script>
|
<script src="app.js" charset="utf-8"></script>
|
||||||
</body>
|
</body>
|
||||||
|
Loading…
Reference in New Issue
Block a user