Vdt.configure(options)

使用Vdt.configure(options)方法可以全局配置Vdt的一些行为。

另外编译Vdt模板时，可以传入一些配置来单独改变该次编译行为

  • Vdt(source, [options])
  • Vdt.compile(source, [options])

其中options默认配置如下：

  1. {
  2.     autoReturn: true,
  3.     onlySource: false,
  4.     delimiters: ['{', '}'],
  5.     noWith: false,
  6.     server: false,
  7.     skipWhitespace: false,
  8.     disableSplitText: false,
  10.     // @since v1.3.1
  11.     skipWhitespace: true,
  12.     indent: '    '
  13. }

autoReturn

模板的最后一个元素会被返回，这是因为编译时，会在最后一个元素前加入return关键词，如果你已经
手动添加了return关键词，则可以将该值设为false来阻止再次添加

  1. var ret;
  2. if (isNew) {
  3.     ret = <div>new</div>
  4. } else {
  5.     ret = <div>old</div>
  6. }
  7. // 手动返回
  8. return ret;

onlySource

模板编译后会调用new Function()来创建模板函数，如果此时存在js语法错误，则该操作会报错。

当Vdt仅仅作为middleware用于实时编译时，我们可能不关心该错误，而是将编译结果直接返回给浏览器，
在浏览器中再调试该错误。

将onlySource设为true，会阻止js语法错误，直接将编译结果取回来，如下所示：

  1. var template = Vdt.compile(source, {
  2.     onlySource: true
  3. });
  5. template.source; // 获取编译结果

delimiters

模板中js表达式分隔符，默认为一对大括号{}，你可以通过设置delimiters来改变它。

如果你想改变全局的分隔符，而不是单次编译，可以通过Vdt.setDelimiters()来改变

  1. // 设置单次编译的分隔符
  2. Vdt.compile(source, {
  3.     delimters: ['{{', '}}']
  4. });
  6. // 设置全局分隔符
  7. Vdt.setDelimiters(['{{', '}}']);

noWith

在模板中，获取传入模板的数据，并不需要通过对象访问操作符.来获取属性值，如：obj.name，
这是因为Vdt会将模板包含在with (obj) { }下面。

但这会影响对象访问的性能，我们可以通过将noWith设为true，来去掉该包装。
此时我们可以通过scope或者this.data来访问属性，如：
scope.name，this.data.name。

  1. <div>{scope.name} {this.data.name}</div>
  1. var vdt = Vdt(source, {
  2.     noWith: true
  3. });
  5. vdt.render({
  6.     name: 'Vdt'
  7. });

server

该值用来标识前端还是后端渲染

  1. * `true` 后端渲染
  2. * `false` 前端渲染

skipWhitespace

是否去掉两个标签之间的空白字符，默认会保留

@since v1.3.1 默认会去掉空白字符

disableSplitText

当前后端同构时，后端返回的字符串是否使用<!---->分割，默认会。

例如：模板为<span>{a}{b}</span>，{a: 1, b: 2}，如果没有分割，会渲染成<span>12</span>，
浏览器接受到该html字符串，会将12渲染成一个文本节点，但其实它是两个变量的绑定（a和b），
当前端混合该dom时，就会出错。而分割后，会返回<span>1<!---->2</span>，混合时会忽略注释，将
文本当做两个节点处理。

indent

@since v1.3.1

模板文件编译后的代码缩进风格，默认4个空格缩进