tyrel/learnin-some-vue
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

s2e25 shorthands

Browse Source
This commit is contained in:
Tyrel Souza 2018-04-13 14:34:38 -04:00
parent d3bdeee2a3
commit 12053e4e2b
No known key found for this signature in database
GPG Key ID: 5A9394D4C30AEAC0
2 changed files with 5 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app.js
View File

@ -1,28 +1,11 @@
var app = new Vue({ var app = new Vue({
el: '#app', el: '#app',
data: { data: {
counter: 0, link: 'https://tyrelsouza.com',
secondCounter: 0,
}, },
methods: { methods: {
result(){ changeLink(){
console.log("result"); this.link = "https://tyrel.bike";
return this.counter >= 5 ? ">=5" : "<5"
}
},
watch: {
counter(value){
var vm = this;
setTimeout(function(){
vm.counter = 0;
}, 2000)
}
},
computed: {
output(){
console.log("computed");
return this.counter >= 5 ? ">=5" : "<5"
} }
} }

9
index.html
View File

@ -6,14 +6,9 @@
</head> </head>
<body> <body>
<div id='app'> <div id='app'>
<button v-on:click="counter++">Increase</button> <button @click="changeLink">Change to Link</button>
<button v-on:click="counter--">Decrease</button> <a :href='link'>Link</a>
<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>
</body> </body>
</html> </html>