cheft / riot-spa-template

a riot spa template

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Alt text

cheftjs

是基于 riot.js 薄封装的一套类 flux 框架

||=====================||      
||     Application     ||
||=====================||
||        Router       ||
||=====================||
Tag   -->  do  -->   on
  \        |         /
   \     Store      /
    \______________/
          <--

Application

var c = require('cheftjs');
var app = new c.Applicaton({
    router: require('./router.js')
});    

Router - like backbone

module.exports = {
    routes: {
        '': 'home'
    },
    home: function() {

    }
}
<test>
    <script></script>
    <h1>{result}</h1>
    <button onclick={clickMe}>test</button>
</test>

do

module.exports = {
    do: {
        clickMe: function() {
            this.result = 'click success!';
            this.trigger('clicked');
        }
    }
}

Store

module.exports = {
    store: ''
}

or

module.exports = {
    store: {
        url: '',
        contentType: ''
    }
}

method

  • get()
  • save()
  • del()
  • post()
  • put()

on

module.exports = {
    on: {
        init:    function() {}
        mount:   function() {}
        update:  function() {}
        updated: function() {}
        geted  : function(data, status) {}
        posted : function(data, status) {}
        puted  : function(data, status) {}
        saved  : function(data, status) {}
        deleted: function(data, status) {}
        
        clicked : function() {
            console.log('the tag can auto update');
        }
    }
}

Demo

cd demo
npm install
gulp

Alt text

Alt text

About

a riot spa template


Languages

Language:JavaScript 90.4%Language:HTML 7.4%Language:CoffeeScript 1.5%Language:CSS 0.6%