Skip to content

HappyRhino/hr.collection

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

hr.collection Build Status

Data modelling utility

Installation

$ npm install hr.collection

Documentation

Creation

Create a new collection by extending the default Collection:

var Collection = require("hr.collection");

var Posts = Collection.extend({
    model: Post
});

Collection instance

var posts = new Posts();

Add and remove models

var post = new Post();

// Append the post
posts.add(post);

// Remove the post
posts.remove(post);

Events

// When a new model is added
posts.on("add", function(model) { });

// When a model is removed
posts.on("remove", function(model) { });

// When the collection is reset
posts.on("reset", function() { });

Example with React

var React = require('react');
var Collection = require("hr.collection");

var Users = Collection.extend({

});

var UserItem = React.createClass({
    render: function() {
        return <li>{this.props.user.get('username')}</li>;
    }
});

var UsersList= React.createClass({
    componentWillMount : function() {
        this.props.users.on("all", this.forceUpdate.bind(this));
    },
    componentWillUnmount : function() {
        this.props.users.off("all", this.forceUpdate.bind(this));
    },
    render: function() {
        var users = this.props.users.map(function(user) {
            return <UserItem user={user} />;
        });

        return <ul className="users">{users}</ul>;
    }
});