1.0.1 • Published 7 years ago
eye-patch v1.0.1
eye-patch
一个简单高效的MVVM库。
核心方法
h
生成虚拟DOM树
参数:
- type {string}
- DOM节点名称,若是文本则为undefined
- data {object}
- props {object}
- DOM属性:attributes = value
- class {object}
- 样式类:className = boolean
- style {object}
- 内联样式:name = value
- delayed {object}
- 渲染时过场动画定义
- remove {object}
- 移除时过场动画定义
- bind {object}
- 事件监听集合:event = func | func, arg1, arg2, ...
- props {object}
- children {array|string|number}
- 若为数组,则表示子虚拟DOM树
- 若为字符串或数字,则表示文本类型虚拟DOM
var vnode = h('div', {style: {color: '#000'}}, [
h('h1', 'Headline'),
h('p', 'A paragraph')
]);
patch
对比两个虚拟DOM树并渲染
参数:
- oldVnode {vnode|element}
- newVnode {vnode}
Hooks
Name | Triggered when | Arguments to callback |
---|---|---|
pre | the patch process begins | none |
init | a vnode has been added | vnode |
create | a DOM element has been created based on a vnode | emptyVnode, vnode |
insert | an element has been inserted into the DOM | vnode |
prepatch | an element is about to be patched | oldVnode, vnode |
update | an element is being updated | oldVnode, vnode |
postpatch | an element has been patched | oldVnode, vnode |
destroy | an element is directly or indirectly being removed | vnode |
remove | an element is directly being removed from the DOM | vnode, removeCallback |
post | the patch process is done | none |
The following hooks are available for modules: pre
, create
,
update
, destroy
, remove
, post
.
The following hooks are available in the hook
property of individual
elements: init
, create
, insert
, prepatch
, update
,
postpatch
, destroy
, remove
.