vue项目导入excel单列导入

先安装 xlsx.js, 然后引入

import XLSX from 'xlsx';

代码

1 

2                 
3                     "</span><span style="color:#800000;">content</span><span style="color:#800000;">"</span> v-model=<span style="color:#800000;">"</span><span style="color:#800000;">content</span><span style="color:#800000;">"</span> placeholder=<span style="color:#800000;">"</span><span style="color:#800000;">please fill in the sentence</span><span style="color:#800000;">"</span>>
4                 
5                 class="upimg">"img">"file" class="file" name="file" @change="getFile($event)">
6                 "submitForm($event)">submit
7             

View Code

 1 import XLSX from 'xlsx';
 2     export default{
 3         name: 'ssadd',
 4         data(){
 5             return {
 6                 content: '',
 7                 file: '',
 8                 img: '../src/assets/images/Upload-picture.png'
 9             }
10         },
11         methods: {
12             //导入excel获取到内容
13             getFile(event){
14                 //wb 存储读取完成的数据
15                 //jsondata 存储获取excel json数据
16                 var wb,jsondata,that=this;
17                 var f = event.target.files[0];
18                 var reader = new FileReader();
19                 reader.onload = function(e){
20                     var data = e.target.result;
21                     wb = XLSX.read(data, {type: "binary"});
22                     jsondata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
23                     // 将获取到的数据逐条连接入that.content中
24                     for(var i=0;i){
25                         if(that.content==""){
26                             that.content = jsondata[i].sentence;
27                         }else{
28                             that.content += ("
" + jsondata[i].sentence);
29                         }
30                         
31                     }
32                     console.log(that.content);
33                 }
34                 reader.readAsBinaryString(f);
35             },
36             submitForm(event){
37                 event.preventDefault();
38 
39                 let params = new URLSearchParams();
40 
41                 params.append('content', this.content);
42 
43                 this.axios.post('url', params).then((ret)=>{
44                     if(ret.status === 200){
45                         console.log(ret);
46                         this.$router.push(ret.data.requireUrl);
47                     }
48                 })
49             }
50         },
51         mounted(){
52             
53         }

View Code

后端接收并添加到数据库

代码

 1 php 
 2     require '../config/config.php';
 3     $conn = Connect();
 4 
 5     $patterns = array('\'', '"');
 6     $replacements = array('&apos', '"');
 7 
 8     $data = str_replace($patterns, $replacements, $_POST['content']);
 9     $arr = explode("
", $data);
10 
11     $sql = "INSERT INTO ssentence (content) VALUES (?)";
12 
13     $stmt = mysqli_stmt_init($conn);
14 
15     if(mysqli_stmt_prepare($stmt, $sql)){
16         mysqli_stmt_bind_param($stmt, 's', $content);
17         // 注 此处's'如只给一个字段插入就只写一个s，插入几个字段的数据就写几个
18 
19         for($i=0;$i){
20             $content = $arr[$i];
21             mysqli_stmt_execute($stmt);
22         }
23 
24         $arr=[
25                 "status"=>200,
26                 "message"=>"add data success",
27                 "requireUrl"=>"/sslist"
28             ];
29         echo json_encode($arr);
30     }else{
31         echo "创建数据表错误：" . $conn->error;
32     }
33     
34 
35     $conn->close();
36  ?>

View Code

 

转载于:https://www.cnblogs.com/studycollect/p/11309681.html