no message
Former-commit-id: 5ad7ba5e0ab03190c9d778ccf41d9bef4c7eb7c8 Former-commit-id: f4b384d5efbec542b2953009e99338b3cb3bed63 Former-commit-id: f9914c43cef036556edd17c04ca7424078fbb2c7
This commit is contained in:
@@ -21,6 +21,11 @@ export default {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
highlight: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
@@ -55,7 +60,7 @@ export default {
|
||||
},
|
||||
marked (data) {
|
||||
return marked(data, {
|
||||
highlight: (code) => highlight.highlightAuto(code).value
|
||||
...this.highlight ? {highlight: (code) => highlight.highlightAuto(code).value} : {}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -46,7 +46,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
handleUpload (file) {
|
||||
this.$import.excel(file)
|
||||
this.$import.xlsx(file)
|
||||
.then(({header, results}) => {
|
||||
this.table.columns = header.map(e => {
|
||||
return {
|
||||
|
||||
@@ -19,8 +19,8 @@ export default {
|
||||
})
|
||||
})
|
||||
},
|
||||
// 导入 excel
|
||||
excel (file) {
|
||||
// 导入 xlsx
|
||||
xlsx (file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader()
|
||||
const fixdata = data => {
|
||||
|
||||
@@ -1,26 +1,72 @@
|
||||
解析 CSV 文件使用 [PapaParse](https://github.com/mholt/PapaParse)
|
||||
# Vue.$import
|
||||
|
||||
本框架集成了数据导入功能,并包装成插件
|
||||
|
||||
## 注册插件
|
||||
|
||||
> 默认已经注册,可以直接使用
|
||||
|
||||
```
|
||||
// 导入插件
|
||||
import papa from 'papaparse'
|
||||
import pluginImport from '@/plugin/import'
|
||||
Vue.use(pluginImport)
|
||||
```
|
||||
|
||||
//在选择文件后处理数据
|
||||
之后就可以在组件中使用 `this.$import` 来调用导出功能
|
||||
|
||||
## Vue.$import.csv()
|
||||
|
||||
导入csv文件,并且返回一个 `Promise` 对象
|
||||
|
||||
参数
|
||||
|
||||
| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
|
||||
| --- | --- | --- | --- | --- | --- |
|
||||
| file | 选择的文件 | 是 | File | | |
|
||||
|
||||
使用
|
||||
|
||||
```
|
||||
// 在选择文件后调用
|
||||
handleUpload (file) {
|
||||
papa.parse(file, {
|
||||
header: true,
|
||||
skipEmptyLines: true,
|
||||
complete: (results, file) => {
|
||||
// 设置表格列
|
||||
this.table.columns = Object.keys(results.data[0]).map(e => ({
|
||||
this.$import.csv(file)
|
||||
.then(res => {
|
||||
this.table.columns = Object.keys(res.data[0]).map(e => ({
|
||||
label: e,
|
||||
prop: e
|
||||
}))
|
||||
// 表格赋值
|
||||
this.table.data = results.data
|
||||
}
|
||||
})
|
||||
this.table.data = res.data
|
||||
})
|
||||
// 阻止默认的上传
|
||||
return false
|
||||
}
|
||||
```
|
||||
|
||||
> 详细的papaparse使用API请移步官网文档
|
||||
## Vue.$import.xlsx()
|
||||
|
||||
导入xlsx文件,并且返回一个 `Promise` 对象
|
||||
|
||||
参数
|
||||
|
||||
| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
|
||||
| --- | --- | --- | --- | --- | --- |
|
||||
| file | 选择的文件 | 是 | File | | |
|
||||
|
||||
使用
|
||||
|
||||
```
|
||||
// 在选择文件后调用
|
||||
handleUpload (file) {
|
||||
this.$import.xlsx(file)
|
||||
.then(({header, results}) => {
|
||||
this.table.columns = header.map(e => {
|
||||
return {
|
||||
label: e,
|
||||
prop: e
|
||||
}
|
||||
})
|
||||
this.table.data = results
|
||||
})
|
||||
// 阻止默认的上传
|
||||
return false
|
||||
}
|
||||
```
|
||||
Reference in New Issue
Block a user