https://github.com/anthonyshort/view

Simple view based on Backbone.View but simple and doesn't require jQuery
https://github.com/anthonyshort/view

Last synced: 24 days ago
JSON representation

Simple view based on Backbone.View but simple and doesn't require jQuery

• Host: GitHub
• URL: https://github.com/anthonyshort/view
• Owner: anthonyshort
• Created: 2012-11-16T12:24:23.000Z (almost 12 years ago)
• Default Branch: master
• Last Pushed: 2013-02-16T05:39:18.000Z (over 11 years ago)
• Last Synced: 2024-04-15T03:16:22.908Z (7 months ago)
• Language: JavaScript
• Homepage:
• Size: 144 KB
• Stars: 0
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md

Awesome Lists containing this project

README

        
# View

A tiny view class based on Backbone.View. I wanted to be able to use views to solve simpler problems without needing to rely on needing a framework. This includes jQuery. The view provides functionality similar to the Backbone view but a little bit simpler. 

What it does and what it is:

  * Doesn't rely on jQuery

  * Similar interface to Backbone.View

  * Uses event hash to delegate events on the element

  * The ability to add and control sub-views

  * Clean up views and sub-views using the `destroy` method

  * Methods for interacting with the element, eg. append, find, remove etc.

  

Currently it doesn't do anything in the way of template rendering. It supplies a render method like Backbone.

## Installation

    $ component install anthonyshort/view

## API

Create a sub-class of the View by calling `View.create`.

```js

var MyView = View.create({

  events: {

    'click .item': 'clickIt'

  },

  initialize: function(options) {

    var item = new View({ el: this.find('.item') });

    this.addSubview(item)

  },

  clickIt: function(event) {

    event.preventDefault();

  },

  render: function() {

    this.subviews.forEach(function(view){

      view.render();

    });

    this.html('
foo!
');

  }

});


var view = new MyView({

  el: $(".js-view")

});

view.render();

view.destroy();

```

## License

  MIT