标签:api 语言 实现 note linux中 在线 虚拟 change 对比
var snabbdom = window.snabbdom;
// 定义patch
var patch = snabbdom.init([
snabbdom_class,
snabbdom_props,
snabbdom_style,
snabbdom_eventlisteners
])
// 定义h
var h = snabbdom.h;
var container = document.getElementById('container');
// 生成vnode
var vnode = h('ul#list', {}, [
h('li.item', {}, 'Item 1'),
h('li.item', {}, 'Item 2'),
]);
patch(container, vnode)
// 修改DOM内容
document.getElementById('btn-change').addEventListener('click', function () {
// 生成newVnode
var newVnode = h('ul#list', {}, [
h('li.item', {}, 'Item 1'),
// DOM节点中不同的地方
h('li.item', {}, 'Item B'),
h('li.item', {}, 'Item 3'),
]);
patch(vnode, newVnode)
})
[!NOTE]
核心API总结:
标签:api 语言 实现 note linux中 在线 虚拟 change 对比
原文地址:https://www.cnblogs.com/fecommunity/p/11917869.html