Riot.js 2.2 Bug Report Template
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.2.4/riot+compiler.min.js"></script>
<parent-tag></parent-tag>
<div id="log">
</div>
<script type="riot/tag">
<parent-tag>
<button onclick="{raiseEvent2}">{ person.get('name') }</button>
<your-tag person={ person } name="test"></your-tag>
this.person = opts.person
this.person.on('change:name', function(e){
debugger;
console.log(e);
})
raiseEvent2() {
this.person.set('name', 'Jorge')
}
</parent-tag>
<your-tag>
<button onclick="{raiseEvent}">Raise Event { person.get('name') }</button>
this.person = opts.person
this.person.on('change:name', this.update)
raiseEvent() {
this.person.set('name', 'Tero')
}
</your-tag>
</script>
CSS
body {
font-family: sans-serif;
}
JavaScript
var Person = function (opts) {
// set some initial properties and keep them private
var attrs = opts
// make this class observable
riot.observable(this)
// public method to set an internal property
this.set = function (prop, val) {
attrs[prop] = val
// trigger the events for the listeners
this.trigger('change', attrs[prop])
.trigger('change:' + prop, val)
}.bind(this)
// public method to get internal properties
this.get = function (prop) {
if (prop) return attrs[prop]
else return attrs
}
}
riot.mount('*', { person: new Person({ name: 'Gianluca' }) });