Skip to content
This repository was archived by the owner on May 24, 2019. It is now read-only.

Events and Methods

Jump to bottom
Pascal edited this page Aug 25, 2017 · 2 revisions

https://github.com/oanstein/VueJS-Complete-Guide-Code/tree/master/01_dom_interaction/01_events_and_methods

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

  <div id="app">
    <input type="text" v-on:input="writeTitle">
    <button v-on:click="changeTitle">Change title</button>
    <p>{{ title }}</p>
    <p>{{ sayHello() }}</p>
  </div>

  <script src="https://unpkg.com/vue"></script>
  <script src="main.js"></script>
</body>
</html>
new Vue({
  el: '#app',
  data: {
    title: 'hello world!'
  },
  methods: {
    changeTitle() {
      this.title = 'Changed title';
    },
    writeTitle(event){
      this.title = event.target.value;
    },
    sayHello: function(){
      return 'Hello!';
    }
  }
});

Index

Clone this wiki locally