ractive-adaptors-backbone
Backbone adaptor for Ractive.js
Last updated 6 years ago by rich_harris .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install ractive-adaptors-backbone 
SYNC missed versions from official npm registry.

ractive-adaptors-backbone

Use Backbone models and collections in your Ractive components.
View demo ›

Status

Find more Ractive.js plugins at docs.ractivejs.org/latest/plugins

Installation

Include ractive-adaptors-backbone.min.js on your page below Ractive, e.g:

<script src='lib/ractive.min.js'></script>
<script src='lib/ractive-adaptors-backbone.min.js'></script>

To get ractive-adaptors-backbone you can:

Use CDN

//cdn.jsdelivr.net/ractive.adaptors-backbone/latest/ractive-adaptors-backbone.min.js

Use bower

$ bower i ractive-adaptors-backbone

Use npm

$ npm install --save ractive-adaptors-backbone

Download

Usage

If you're using <script> tags to manage your dependencies, everything is already set up, and you can use the adaptor like so:

var user = new Backbone.Model({
  name: 'world'
});

var ractive = new Ractive({
  el: 'main',
  template: '<h1>Hello {{user.name}}!</h1>',
  data: {
    user: user
  }
});

// If you interact with the model, the view will change
user.set( 'name', 'everybody' );

If Backbone isn't a global variable (e.g. you're using Browserify or RequireJS), you need to register it:

// Example with CommonJS modules - it also works with AMD
var Backbone = require( 'backbone' );
var Ractive = require( 'ractive' );
var backboneAdaptor = require( 'ractive-adaptors-backbone' );

backboneAdaptor.Backbone = Backbone;

var ractive = new Ractive({
  el: 'main',
  template: '<h1>Hello {{user.name}}!</h1>',
  data: {
    user: user
  },

  // this line tells Ractive to look out
  // for Backbone models
  adapt: [ backboneAdaptor ]
});

License

MIT

Current Tags

  • 0.3.0                                ...           latest (6 years ago)

2 Versions

  • 0.3.0                                ...           6 years ago
  • 0.2.0                                ...           6 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (0)
None
Dev Dependencies (14)

Copyright 2014 - 2016 © taobao.org |