模板json与打印数据

打印数据

上一节,已经清楚了模板json的大致格式. 那么怎么去填充模板中对应的数据呢?

那么就一定要清楚模板json中的几个重要参数:

填充数据的几个重要参数

名称	参数键	说明	备注
标题	title	支持html	有字段名时渲染为: "标题:打印数据" 会带有中文冒号":"
字段名	field	根据打印数据的key填充数据	支持 a.b.c 格式
测试数据	testData	设计且有字段名时 展示
标题显示隐藏	hideTitle	隐藏标题	隐藏标题则可隐藏 中文冒号":"

温馨提示

当然,还可以使用高级tab 中的 格式化函数, 自定义填充数据.

填充数据示例

首先需要两个数据: 模板json 和 打印数据.

温馨提示

模板json 的字段名(field) 和 打印数据的 key 必须一致.

这两个数据是 json对象 json对象 json对象. 不能是 vue3 的 proxy 对象.

模板json

{
  // 省略...
  printElements: [
    {
      options: {
        left: 439.5,
        top: 10.5,
        height: 50,
        width: 150,
        title: '标题',
        // 关键参数 field
        field: 'name', // 根据打印数据的key填充数据
        testData: '测试数据',
        hideTitle: false,
      },
      printElementType: {
        title: '文本',
        type: 'text',
      },
    },
  ];
}

打印数据

{
  name: '测试数据';
}