Skip to content

Latest commit

 

History

History
146 lines (119 loc) · 2.88 KB

README.md

File metadata and controls

146 lines (119 loc) · 2.88 KB
Raw

cue

All Contributors

Target

Lightweight high performance MVVM framework（benchmarks）

Flowsheet

Start

git clone https://github.com/handoing/cue
cd cue/
# 安装依赖
npm install

# 启动示例
npm run run:example

# 启动示例
npm run run:template-explorer

# 监听packages文件变更
npm run watch

# 项目构建
npm run build

# 测试
npm run test

Usage

tpl:

<div
  class="main"
>
  <img class="image" on-click={{this.onChange($event)}} src="{{img}}"/>
  <div class="toggle">toggle {{toggle}}</div>
  <span class="icon"></span>
</div>

js:

module.exports = {
  data: {
    toggle: true,
    img: 'https://hao8.qhimg.com/t01c413c779df7eeecb.jpg'
  },
  created() {
    console.log('created');
  },
  updated() {
    console.log('updated');
  },
  mounted() {
    console.log('mounted');
  },
  destroyed() {
    console.log('destroyed');
  },
  onChange(e) {
    this.setData({
      toggle: !this.data.toggle
    })
  }
};

Progress

compile:

  • 模板插值
  • 模板表达式
  • 模板事件
  • 模板if
  • 模板list
  • 模板include
  • 过滤器
    • 自定义过滤器
  • 指令
    • c-show
    • c-hide
    • c-class
    • c-html
    • c-model
    • c-style
    • 自定义指令
  • 组件

runtime:

  • 生命周期
    • created
    • updated
    • mounted
    • destroyed
  • 实例属性与方法
  • 过滤器
    • 自定义过滤器
  • 指令
    • c-show
    • c-hide
    • c-class
    • c-html
    • c-model
    • c-style
    • 自定义指令
  • 事件
  • 组件
    • 全局组件
    • 局部组件
  • 虚拟dom diff
  • 异步数据更新
  • 插件机制

Contributors ✨

Thanks goes to these wonderful people (emoji key):


Double Han
💻 📖

This project follows the all-contributors specification. Contributions of any kind welcome!