import { Model } from 'react-axiom';
 
class Task extends Model {};
 
const task1 = new Task({
  completed: false,
  description: 'Hello world'
});

task1.isCompleted();
//=> false
 
task1.setCompleted(true);
task1.isCompleted();
//=> true
 
task1.getDescription();
//=> 'Hello world'
 
task1.hasDescription();
//=> true
 
task1.setDescription('Hello again');
task1.getDescription();
//=> 'Hello again'

import React from 'react';
import { subscribe } from 'react-axiom';
 
class TaskComponent from React.Component {
  render() {
    const { task } = this.props;
    return (
      <li>
        <input
          type="checkbox"
          onClick={() => task.setCompleted(true)}
          checked={task.isCompleted()}
        />
        {task.getDescription()}
      </li>
    );
  }
}
 
const TaskSubscriber = subscribe(TaskComponent);

ReactDOM.render(<TaskSubscriber task={task1} />);