问题描述:在aspx页面中调用 Vue 组件进行打印,在不刷新页面的情况下,每次传递到Vue中的数据是正确的,但打印出的数据始终是第一次的数据;解决方法如下

    代码由

    window.vapp_commander = new Vue({
    el: '#commander',
    data() {
    return {
    list: []
    }
    },
    template: <br />

    <br /> <br />
    <br />``,
    methods: {
    print(list) {
    this.list = list;
    var com = this.$refs.commanderid;
    `<br /> console.log(com); <br /> com.print(); <br /> } <br /> } <br />}) `

    改写为:
    (function () {
    `<br /> const app = new Vue({ <br /> data() { <br /> return { <br /> flag: false, <br /> list: [] <br /> } <br /> }, <br /> template: `<br />

    <br /> <br />
    <br />``,
    methods: {
    async print(list) {
    this.flag = false;
    this.list = list;
    await this.$nextTick();
    this.flag = true;
    await this.$nextTick();
    var com = this.$refs.commanderid;
    com.print();
    }
    }
    })
    //创建div 存放组件,这样可以在页面中不声明这个组件
    const dom = document.createElement('div');
    document.body.appendChild(dom);
    app.$mount(dom);
    `<br /> window.vapp_commander = app; <br />})();`

    调用处代码不用变:window.vapp_commander.print(rsp.rows);
    完整代码如下:
    function vue_print() {
    if (window.vapp_commander) {
    const url = "/api/SvrOrder/GetOrderList_ServerPage";
    `<br /> const filter = queryParams(); <br /> const total = $(“#tbRsv”).bootstrapTable(‘getOptions’).totalRows; <br /> const pager = { <br /> page_no: 1, <br /> page_size: total, <br /> sort_name: “ARRTIME”, <br /> is_desc: “false” <br /> } <br /> $.post(url, { filter: JSON.stringify(filter), pager: JSON.stringify(pager) }, function (rsp) { <br />//调用组件<br /> window.vapp_commander.print(rsp.rows); <br /> }) <br /> <br /> } <br /> }`