From 2926059c428370a9d3c6b49d6976b53796d4fd3b Mon Sep 17 00:00:00 2001 From: Andreas Zweili Date: Mon, 18 Jan 2021 20:56:35 +0100 Subject: [PATCH] lesson 26: two-way binding --- .../app.js | 37 ++++++++++--------- .../index.html | 31 ++++++++-------- 2 files changed, 36 insertions(+), 32 deletions(-) diff --git a/basics-05-using-the-native-event-object/app.js b/basics-05-using-the-native-event-object/app.js index 719c807..98c33b0 100644 --- a/basics-05-using-the-native-event-object/app.js +++ b/basics-05-using-the-native-event-object/app.js @@ -1,22 +1,25 @@ const app = Vue.createApp({ - data() { - return { - counter: 0, - name: '' - }; - }, - methods: { - setName(event, lastName) { - this.name = event.target.value + ' ' + lastName; + data() { + return { + counter: 0, + name: "", + }; }, - add(num) { - this.counter = this.counter + num; + methods: { + setName(event, lastName) { + this.name = event.target.value; + }, + add(num) { + this.counter = this.counter + num; + }, + reduce(num) { + this.counter = this.counter - num; + // this.counter--; + }, + resetInput() { + this.name = ""; + }, }, - reduce(num) { - this.counter = this.counter - num; - // this.counter--; - } - } }); -app.mount('#events'); +app.mount("#events"); diff --git a/basics-05-using-the-native-event-object/index.html b/basics-05-using-the-native-event-object/index.html index e894f75..20453f5 100644 --- a/basics-05-using-the-native-event-object/index.html +++ b/basics-05-using-the-native-event-object/index.html @@ -1,28 +1,29 @@ - + + Vue Basics - + - - + + +
-

Vue Events

+

Vue Events

-

Events in Action

- - -

Result: {{ counter }}

- -

Your Name: {{ name }}

+

Events in Action

+ + +

Result: {{ counter }}

+ + +

Your Name: {{ name }}

- + +