大神們，有個問題請教下你們，download-excel和 this.$confirm這個彈出方式不能公用嗎？點擊確定不能匯出。不用this.$confirm時可以正常使用的。
具體步驟：
我下載了匯出插件 npm install vue-json-excel -S
然后參考 import JsonExcel from 'vue-json-excel';
第一步：我先寫組件 （這個是做成按鈕的樣式）
<download-excel class="blueBtn" :data="https://bbs.csdn.net/topics/json_data" :fields = "json_fields" id="blueBtnDownload"
worksheet = "My Worksheet" :name="excelName" ref="blueBtnDownload"
>
<el-button type="warning" icon="el-icon-top-right" @click="bn_openExport()">批量匯出 </el-button>
</download-excel>
第二部：data資料定義
data(){
return{
//批量匯出
excelName:"表格名稱"//要匯出表格的名稱
json_fields: { //匯出Excel表格的表頭設定
'name': 'name',
'age': 'age',
'sex': 'sex',
'number': 'number',
},
json_data:[],//匯出的表格內容，注意都是字串
}
}
第三步：寫方法
bn_openExport(){
//給表格內容賦值
var value = this.value; //假設這是你后臺獲取的內容，或者是你table表格的內容,shi json格式
for(let i=0;i<test.length;i++){
this.json_data.push({"name":value[i].name,"age":value[i].age,"sex":value[i].sex,"number":value[i].number})
}
}
做完以后，點擊按鈕，是可以正常匯出的，格式資料啥的都沒有錯誤；
問題來了，我是想添加一個提示框，用戶確定后在匯出，所以我使用this.$confirm的彈框方式
this.$confirm('你確定要匯出嗎？', '提示', {
confirmButtonText: '確定',
cancelButtonText: '取消',
type: 'warning'
}).then(()=>{
//用戶點擊了確定按鈕，執行
//假設這是你后臺獲取的內容，或者是你table表格的內容,shi json格式
var value = this.value;
for(let i=0;i<value .length;i++){
//我們把需要匯出的值匯出，json格式
this.json_data.push(
{"name":value[i].name,"age":value[i].age,"sex":value[i].sex,"number":value[i].number}
);
}
}).catch((err)=>{
this.$message({
message: "用戶點擊了取消",
type: "info",
});
});
點擊了按鈕后發現沒有回應，.then(()=>{}里面的東西都不執行，里面的內容沒有啥變化，點擊了列印，是可以正常進入到里面，但是就是匯出沒有反應，目前我猜這個download-excel組件的功能在點擊按鈕的時候已經執行過一次了，在加個彈框，再次點擊確定按鈕，第二次操作時沒有執行的。
我試過el-button和download-excel這個分開，然后點擊@click="bn_openExport()"按鈕事件的時候，document.getElementById("blueBtnDownload").click再去模擬點擊它download-excel匯出，還是沒有反應。用ref方式this.#refs.blueBtnDownload.click也不行。
大神們，像這種情況怎么解決？
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/280472.html
標籤：其他
上一篇：求助呀