Intact.Vdt实例

render

传入数据,将模板渲染成DOM元素

render([data[, parentDom[, queue[, parentVNode]]]])

  • @param data {Object} 渲染到模板的数据
  • @param parentDom {HtmlElement} 指定父元素
  • @param queue {MoutedQueue} 指定挂载函数队列
  • @param parentVNode {VNode} 指定父虚拟DOM
  • @return {HtmlElement} 渲染后元素
  • @example
    1. var App = Intact.extend({
    2. template: '<div>{title}</div>'
    3. });
  1. var app = new App();
  2. var element = app.vdt.render({
  3. title: 'Intact'
  4. });
  5. document.getElementById('vdt-render').appendChild(element);

renderVNode

将vdt实例渲染成虚拟DOM

renderVNode([data])

  • @param data {Object}
  • @return {VNode}
  • @example
    1. var app = new App();
    2. var vNode = app.vdt.renderVNode({title: 'Intact'});
    3. // 运行后,打开控制台查看结果
    4. console.log(vNode);

renderString

将vdt实例渲染成字符串

renderString([data])

  • @param data {Object}
  • @return {String}
  • @example
    1. var app = new App();
    2. var html = app.vdt.renderString({title: 'Javey'});
    3. // 运行后,打开控制台查看结果
    4. console.log(html);

update

更新vdt实例对应的DOM,必须调用render()方法渲染后,才能更新

update([data[, parentDom[, queue[, parentVNode]]]])

  • @param data {Object} 渲染到模板的数据
  • @param parentDom {HtmlElement} 指定父元素
  • @param queue {MoutedQueue} 指定挂载函数队列
  • @param parentVNode {VNode} 指定父虚拟DOM
  • @return {HtmlElement} 渲染后元素
  • @example
    1. var app = new App();
    2. var dom = app.vdt.render({title: 'Intact'});
    3. document.getElementById('vdt-update').appendChild(dom);
  1. // 更新vdt
  2. app.vdt.update({title: 'Javey'});