前端 js导出excel

一、导出效果 

二、导出代码 

download() {
  let data = [{
      name: 'aaaa',
      age: 10,
      address: '广东',
      phone: '1',
      wechart: '1'
    },
    {
      name: 'bbbb',
      age: 11,
      address: '广西',
      phone: '2',
      wechart: '2'
    },
    {
      name: 'cccc',
      age: 12,
      address: '山东',
      phone: '3',
      wechart: '3'
    }
  ]
  if (!data.length) {
    this.$Message.warning('没有可以导出的数据');
    return;
  }
  let table = `
    `;

  for (let i = 0; i < data.length; i++) {
    let {
      name,
      age,
      address,
      phone,
      wechart
    } = data[i];
    table += ``;
  }
  table += '';
  table += '

      

        
序号
        
姓名
        
年龄
        
地址
        
手机号
        
微信号
    
    

                
${i + 1}
                
${name} 
                
${age}
                
${address}
                
${phone}
                
${wechart}
              
';
  let html = `
                
                
                
                
                
                    ${table}
                
              `;
  let url = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(html);
  let a = document.createElement('a');
  a.href = url;
  a.download = `${new Date().Format('yyyyMMddhhmmss')}.xls`;
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}