mizchi/vk

语言: CoffeeScript

git: https://github.com/mizchi/vk

README.md (中文)

VK

CoffeeScript的虚拟DOM模板

Easy Virtual DOM Wrapper灵感来自mauricemach / coffeekup

bower install mizchi/vk

例子

基本用法

React.createClass
  render: -> vk ($) ->
    $.h1 'Hello'
    $.ul className: 'foobar-container', ->
      $.li "foo"
      $.li "bar"

vk生成虚拟DOM

子组件

Greeting = React.createClass
  render: -> vk ($) ->
        $.h1 "Hello"

Item = React.createClass
  render: ->
    {title} = @props
    vk {tag: 'li'}, ($) -> span title

React.createClass
  render: -> vk ($) ->
    $(Greeting)
    $.ul ->
      for i in [1..4]
        $(Item, title: "item:"+i)

API

VK

  • vk.render(块:功能)
  • vk.render(opts:Object,block:Function)

vk.render opts参数是第一个元素。

React.createClass
    render: -> vk tag: 'ul', className: 'foo', ($) ->
        $.li "foo"
        $.li "bar"

判决

  • d。<tagName>(opts:Object,block:Function)
  • d。<tagName>(opts:Object,str:String)
  • d。<tagName>(块:功能)
  • d。<tagName>(string:String)
  • d。<tagName>(opts:Object)

ALL

  • 测试

依赖

  • 应对

执照

WITH

本文使用googletrans自动翻译,仅供参考, 原文来自github.com

en_README.md

vk

Virtual DOM Template for CoffeeScript

Easy Virtual DOM Wrapper Inspired by mauricemach/coffeekup

bower install mizchi/vk

Examples

Basic usage

React.createClass
  render: -> vk ($) ->
    $.h1 'Hello'
    $.ul className: 'foobar-container', ->
      $.li "foo"
      $.li "bar"

vk generate Virtual DOM

Child component

Greeting = React.createClass
  render: -> vk ($) ->
        $.h1 "Hello"

Item = React.createClass
  render: ->
    {title} = @props
    vk {tag: 'li'}, ($) -> span title

React.createClass
  render: -> vk ($) ->
    $(Greeting)
    $.ul ->
      for i in [1..4]
        $(Item, title: "item:"+i)

API

vk

  • vk.render(block: Function)
  • vk.render(opts: Object, block: Function)

vk.render opts argument is for first element.

React.createClass
    render: -> vk tag: 'ul', className: 'foo', ($) ->
        $.li "foo"
        $.li "bar"

DOM

  • d.<tagName>(opts: Object, block: Function)
  • d.<tagName>(opts: Object, str: String)
  • d.<tagName>(block: Function)
  • d.<tagName>(string: String)
  • d.<tagName>(opts: Object)

TODO

  • tests

Dependencies

  • React

LICENSE

MIT