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

Computed Props

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

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

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

  <div id="app">
    <button @click="increment">Increment</button>
    <p>Counter: {{ counter }}</p>
    <p>Clicks: {{ clicks }}</p>
  </div>

  <script src="https://unpkg.com/vue"></script>
  <script src="main.js"></script>
</body>
</html>
new Vue({
  el: '#app',
  data: {
    counter: 0,
    clicks: 0
  },
  methods: {
    increment(){
      this.clicks++;
    }
  },
  computed: {
    counter(){
      return this.clicks * 2;
    }
  }
});

Index

Clone this wiki locally