relift-example-counter.html

relift-example-counter.html

<div>
  <div class="column center" id="counterWidget">
    <div><h4>${this.count}</h4></div>
    <div>
      <button @click="down" class="button-outline">DOWN</button>
      <button @click="up" class="button-outline">UP</button>
    </div>
  </div>  
</div>

<script type="module">
  import reLift from '../src/index.js';

  reLift({
    el: '#counterWidget',
    data: {
      count: 0,
    },
    up() {
      this.data.count++;
    },
    down() {
      this.data.count--;
    },
  });  
</script>