数据绑定

　　在处理公文时，用户会填写标题、附注、选择主抄送、生成文档等，这些事情一部分是由用户在表单中填写的，另一部分则通过自动计算或用户选择等操作提供的。要将这些内容反应到公文编辑器的公文元素中，可以直接给编辑器的data赋值（给编辑器赋值），但最好的方法是使用数据绑定。

　　你可以为每一个版面元素绑定一个表单可输入字段，或者绑定一个方法。

　　正如“访问版面元素”章节中所描述的，每个版面元素有以下配置项，用于值的绑定：

• [name]ValueType：绑定值的类型
• [name]ValueData：绑定表单输入框的选择器
• [name]ValueScript：绑定值的脚本内容

　　下面介绍这几个配置项的使用。

绑定表单可输入字段

　　如果一个版面元素绑定了表单可输入字段，如：input text；input radio；input checkbox；select等表单字段时，当表单元素的值发生改变时，编辑器的内容，也会随之变化。

　　例如，我们要将编辑器的标题字段，与表单上一个id为“title”的input输入框绑定时，就可以在编辑器初始化时设置配置项：subjectValueType　和　subjectValueData：

const editor = DocEditor.createEditor(div, {
  //我们在打包配置中将public目录输出到了 doceditor/public，
  //所以此处需要配置为'./doceditor/' 或 'doceditor/'
  base: './doceditor/',
  
  //绑定值的类型，可选值："data", "script"
  //"data"表示绑定一个表单可输入字段
  //"script"表示绑定一个function或一段脚本
  subjectValueType: "data",
  
  //subjectValueType配置项为data时生效
  //设置表单输入框的选择器
  subjectValueData: "#title"
});
editor.load();

说明一下这些参数：

　　然后当用户在表单中修改标题值时，公文编辑器的标题会和title输入框的值保持同步。（编辑器的同步渲染是在输入框的change事件中，所以只有当焦点移出输入框时触发）

　　您可以在在线编辑器中尝试：在线运行本样例

通过注入函数绑定

　　一些情况下，我们要在公文要素中显示的内容，不完全是用户输入的内容，而是根据文档的数据计算出的一个结果，没有一个表单元素可以绑定，那我们就可以注入函数的方式，将公文要素的值绑定到一个函数。

　　例如对文号的设置，一般会使用一套自动编号机制，并计算当前年份以及发文部门的冠字等，最终拼接出文号，那我们就可以将文号绑定到一个函数。

const editor = DocEditor.createEditor(div, {
  //我们在打包配置中将public目录输出到了 doceditor/public，
  //所以此处需要配置为'./doceditor/' 或 'doceditor/'
  base: './doceditor/',
  
  //绑定值的类型，可选值："data", "script"
  //"data"表示绑定一个表单可输入字段
  //"script"表示绑定一个function或一段脚本
  filenoValueType: "script",
  
  //filenoValueType配置项为script时生效
  //设置一个Function
  filenoValueScript: ()=>{
    const year = (new Date()).getFullYear();
    return `ｘｘｘ〔${year}〕5号`
  }
});
editor.load();

filenoValueScript参数也可以传入一个包含code的对象，code中传入javascript代码字符串，如下面的filenoValueScript设置和上面的设置是等价的：

filenoValueScript: {
  code: "const year = (new Date()).getFullYear(); return `ｘｘｘ〔${year}〕5号`"
}

说明一下这些参数：

在编辑器载入时，filenoValueScript配置绑定的函数会被执行一次，之后如果希望更新文号值，则需要调用编辑器的resetData或getData方法。

您可以在在线编辑器中尝试：在线运行本样例