我需要触发CSV下载,但window.open()
在此上下文中失败。没有控制台错误。
我在exportRecords()
中呼叫Customer.vue
,services.js
通过customer_actions.js
将处理逻辑委托给window
。此时,我认为问题的范围是window.open()
。
如果我将this.exportCsv()
移到<button @click.prevent="exportRecords">Export</button>
<script>
import * as actions from '../../vuex/customers_actions';
export default {
vuex: {
actions
},
data () {
return {
grid: {}
};
},
methods: {
exportRecords: function () {
this.exportCsv([this.$data.grid], function (response) {
window.open('data:text/csv;charset=utf-8,' + encodeURIComponent(response));
});
}
}
};
</script>
之外,它就有效 - 尽管我没有数据。
Customer.vue
import { ApiService } from './services';
export const exportCsv = function (store, grids = [], successCallback) {
ApiService(
store,
{
noun: 'Customer',
verb: 'GetRecordsViewDataAsCSVFile',
data: {}
},
successCallback,
'csv'
);
};
customers_actions.js
export const ApiService = (store, options, successCallback, responseType = 'json') => {
let parameters = {};
store.dispatch('SET_BUSY');
Vue.http.post(API_URL, parameters, []).then((promise) => {
return promise.text();
}, (promise) => {
return promise.text();
}).then(response => {
store.dispatch('SET_NOT_BUSY');
successCallback(response);
});
};
services.js
Customer.ID Date Rank
576293 8/13/2012 2
576293 11/16/2015 6
581252 11/22/2013 4
581252 11/16/2011 6
581252 1/4/2016 5
581600 1/12/2015 3
581600 1/12/2015 2
582560 4/13/2016 1
591674 3/21/2012 6
586334 3/30/2014 1