Mobx extendObservable example

Shows mobx's observable feature author(s): Matt Ruby

by amatiasq

HTML

<div id="react-log"></div>

<script src="https://cdn.jsdelivr.net/g/[email protected](react.min.js+react-dom.min.js),[email protected]"></script>
<script src="https://unpkg.com/[email protected]/lib/mobx.umd.min.js"></script>
<script src="https://unpkg.com/[email protected]/index.js"></script>
<script src="https://rawgit.com/mattruby/mobx-examples/master/logging-utils.js"></script>
<script>
	wrapConsole();
</script>

JavaScript

var person = mobx.observable({
	firstName: 'Matt',
	lastName: 'Ruby',
	age: 34,
  potato: 1,
	get fullName () {
		console.count('fullName');
		return this.firstName + ' ' + this.lastName;
	}
});

mobx.autorun(function auto_fullNameAge () {
	console.log('autorun: ' + person['full' + 'Name'] + ' ' + person.age);
});

person.firstName = 'Mike';
person.firstName = 'Lissy';
person.potato = 10;
person.potato++;
person.age = 50;