项目作者: blikblum

项目描述 :
Custom renderers for MarionetteJS
高级语言: JavaScript
项目地址: git://github.com/blikblum/marionette.renderers.git
创建时间: 2017-05-24T22:08:46Z
项目社区:https://github.com/blikblum/marionette.renderers

开源协议:

下载


marionette.renderers

Collection of custom renderers for Marionette.js

Usage

Import the desired renderer

  1. // with ES modules
  2. import renderer from 'marionette.renderers/[renderer-name]'
  3. // or with CommonJS modules
  4. var renderer = require('marionette.renderers/[renderer-name]')

Configure the Marionette View class

  1. //all views
  2. Marionette.View.setRenderer(renderer)
  3. //or specific view class
  4. var MyView = Marionette.View.extend()
  5. MyView.setRenderer(renderer)

Set template property when defining a view. The format of each template vary with the renderer type

  1. import template from './my-template'
  2. var MyView = Marionette.View.extend({
  3. template: template
  4. })

Options

Is possible to configure the rendering with options defined in the View class:

outerRender Boolean

By default all renderers set the inner contents of the View el. Some renderers allows to
define the outerHTML, i.e., define the attributes of View el in the template.

thisAsState Boolean

By default the data returned by serializeData is passed to the template. By setting thisAsState to true
the view instance will be passed to the template.

Renderers

rivets

Uses rivets as template engine. By its nature (data binding) the view instance is always passed to the template

  • Supports outerRender: no

virtual-dom

Uses virtual-dom to render the HTML

  • Supports outerRender: yes

snabbdom

Uses snabbdom to render the HTML

  • Supports outerRender: yes

idom

Uses incremental-dom to render the HTML

  • Supports outerRender: technically yes, but the template transpiler should not
    set key for root element. See this issue.

inferno

Uses inferno to render the HTML

  • Supports outerRender: no

Examples

See examples folder of this repository for working applications.

idom live example

snabbdom live example