Riot.js: minimal observable example

by meetravi

HTML

<script src="https://cdn.jsdelivr.net/g/[email protected](riot.min.js+compiler.min.js)"></script>
<receiver></receiver>

<script type="riot/tag">
  <receiver>
    <p>{ message }</p>
    
    this.message = 'Zzz...'
    wakeup () {
      this.message = 'Good morning!'
      this.update()
    }
  </receiver>
</script>

JavaScript

var receiver = riot.mount('receiver')[0]

function Timer() {
  riot.observable(this)

  setTimeout(function() {
    this.trigger('ring')
  }.bind(this), 3000)
}

var timer = new Timer()

timer.on('ring', receiver.wakeup)