handle events

Author: jshawl

index.html

@@ -9,9 +9,14 @@
     </div>
     <script type='x-template' id='tree'>
       <div>
-        <div v-for="file in files">
-          {{file.name}}<span v-if="file.tag == 'folder'">/</span>
-        </div>
+	<div v-for="file in files">
+	  <div v-if="file.tag == 'folder'" v-on:click='toggleExpand()'>
+	    {{file.name}}/
+	  </div>
+	  <div v-else>
+	    {{file.name}}
+	  </div>
+	</div>
       </div>
     </script>
     <script>
@@ -22,6 +27,11 @@
       ]
       Vue.component('tree',{
         template: '#tree',
+        methods: {
+          toggleExpand: function(){
+            console.log('togglin!')
+          }
+        },
         data(){
           return {
             files
@@ -33,4 +43,4 @@
       })
     </script>
   </body>
-</html>
+</html>