mirror of
https://github.com/MarcZierle/photo-log-frontend.git
synced 2025-04-07 21:14:37 +00:00
52 lines
1.4 KiB
HTML
52 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="https://unpkg.com/vue@next"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app">
|
|
<h2>{{ title }}</h2>
|
|
<input :value="title" @input="title = $event.target.value" >
|
|
<input v-model="count" type="number" >
|
|
<button @click="increment">Up</button>
|
|
<button @click="decrement">Down</button>
|
|
</div>
|
|
|
|
<script>
|
|
const app = Vue.createApp({
|
|
data() {
|
|
return {
|
|
title: "Hi there",
|
|
count: 4,
|
|
headingColor: 'some'
|
|
}
|
|
},
|
|
watch: {
|
|
count() {
|
|
console.log(this.count)
|
|
}
|
|
},
|
|
methods: {
|
|
increment() {
|
|
this.count++
|
|
},
|
|
decrement() {
|
|
this.count--
|
|
},
|
|
isEven() {
|
|
return this.count % 2 === 0
|
|
}
|
|
}
|
|
})
|
|
|
|
const vm = app.mount('#app')
|
|
</script>
|
|
|
|
<style>
|
|
.even {
|
|
color: pink;
|
|
}
|
|
</style>
|
|
</body>
|
|
</html> |