s2e23 computed properties
This commit is contained in:
parent
be0ddd00f0
commit
8ac77e11d5
17
app.js
17
app.js
@ -1,6 +1,21 @@
|
|||||||
var app = new Vue({
|
var app = new Vue({
|
||||||
el: '#app',
|
el: '#app',
|
||||||
data: {
|
data: {
|
||||||
name: "Tyrel"
|
counter: 0,
|
||||||
|
secondCounter: 0,
|
||||||
},
|
},
|
||||||
|
methods: {
|
||||||
|
result(){
|
||||||
|
console.log("result");
|
||||||
|
return this.counter >= 5 ? ">=5" : "<5"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
output(){
|
||||||
|
console.log("computed");
|
||||||
|
return this.counter >= 5 ? ">=5" : "<5"
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
|
@ -6,8 +6,11 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id='app'>
|
<div id='app'>
|
||||||
<input type="text" v-model="name">
|
<button v-on:click="counter++">Increase</button>
|
||||||
<p>{{name}}</p>
|
<button v-on:click="counter--">Decrease</button>
|
||||||
|
<button v-on:click="secondCounter++">Increase 2nd Counter</button>
|
||||||
|
<p>counter: {{counter}} | {{secondCounter}}</p>
|
||||||
|
<p>result: {{result()}} | {{ output }}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="app.js" charset="utf-8"></script>
|
<script src="app.js" charset="utf-8"></script>
|
||||||
|
Loading…
Reference in New Issue
Block a user