后端返回的数据,自己拼接一下,然后下载成txt文件
vue+springboot使用文件流实现文件下载
<span @click="xiazitxt()">下载txt</span>
data() {
return {
loginName: '七七',
loginPassword: '',
activCodeData: [
{
name: '1111',
code: 'aaaaa'
},
{
name: '2222',
code: 'bbbbb'
},
{
name: '3333',
code: 'cccc'
}
]
}
}
methods: {
exportText(dataStr) {
const name = "文件名称";
const element = document.createElement('a')
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(dataStr))
element.setAttribute('download', name)
element.style.display = 'none'
element.click()
},
xiazitxt() {
let strArr = ''
for(var i = 0; i < this.activCodeData.length; i++) {
strArr += '硬件产品名称:' + this.activCodeData[i].name + '\xa0\xa0' + '\xa0\xa0' + '\xa0\xa0' + '激活码:' + this.activCodeData[i].code + "\n" + "\n"
}
let str = '1, 机构后台信息: ' + "\n" + " \n" +
'2, 机构前端地址: ' + "\n" + " \n" +
'3, 账号信息: ' + "\n" + " \n" +
'用户名: ' + this.loginName + "\n" + " \n" +
'密码: 111111' + "\n" + " \n" +
'4, 设备激活码信息: ' + "\n" + " \n" +
strArr
this.exportText(str)
}
}
最后下载出来的txt文件