From e5aa5d8f328efe57b5c9f79db10e00c614c56613 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sergio=20=C3=81lvarez?= <code@sergio.am>
Date: Sat, 9 Nov 2019 12:34:11 +0100
Subject: [PATCH] computed example

---
 hello/app.js     | 5 +++++
 hello/index.html | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/hello/app.js b/hello/app.js
index db7aaea..08028bc 100644
--- a/hello/app.js
+++ b/hello/app.js
@@ -20,5 +20,10 @@ var app = new Vue({
         reverseMessage: function () {
             this.message = this.message.split('').reverse().join('')
         }
+    },
+    computed: {
+        lenMessage: function () {
+            return this.message.length
+        }
     }
 })
diff --git a/hello/index.html b/hello/index.html
index 88d7c88..27922ad 100644
--- a/hello/index.html
+++ b/hello/index.html
@@ -27,7 +27,7 @@
 
             <button v-on:click="reverseMessage">Reverse Message</button>
 
-            <input v-model="message">
+            <input v-model="message"> <span>{{ lenMessage }}</span>
         </div>
         
         <script src="app.js"></script>