vue使用docxtemplater导出word实现使用textarea输入的内容换行

注:本文只做导出word并且换行操作,不做vue引入docxtemplater步骤

先看一下实现效果

这是文本域输入的

 这是导出来的结果

可以看出来导出来的结果也是换行的呢

接下来我们手摸手操作一下流程


首先咱们捋一捋思路

  1. 知道文本域的换行的换行标识符,我们发现文本域的换行字符为 \n
  2. 导出的时候拿到文本域的数据用split给数据分割一下,转为数组
  3. 把这个数组在word模版中做一个循环
  4. 然后看导出的word是否换行

 这下我们思路已经清楚,接下来我们对着键盘敲敲打打

数据处理

//导出的时候给数据做处理
let data = {content = this.textarea.split('\n')} // \n分割
exportWord("./换行模板.docx", data, "内容换行.docx");

word模版处理

这是 docxtemplater的循环数据  因为我们分割后成数据 数组成员分割了一个 \n 成员有多个 

{#content}  // 循环开始

{.} // 数组每个成员的内容

{/content} // 循环结尾

最后导出效果就是文章开头的效果

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值