先新增，后根据查询结果修改数据，再导出。如何解决新增之后，立即查询修改，vue只能查询修改到新增前的旧数据？

本文链接：https://blog.youkuaiyun.com/weixin_43937851/article/details/126395382

本文档详细介绍了在Vue应用中，如何处理新增数据后立即更新和导出的问题。错误的做法是在新增公共表数据后，直接使用旧的查询结果进行更新和导出。正确的解决方案是确保在新增数据后，先查询最新的数据，再进行内容表的批量更新和导出操作。这样可以避免因查询缓存导致的数据不一致问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、需求

现有期间核查计划表（data_period_inspect_content）和期间表（data_period_inspect_public）两个数据表。其中content表的public_id与public表的id值相对应。
先在前端新增一条public表数据，然后用户选择需要更新的content表数据。向后端传入新增的public表id，和选择的content表id数组。后端根据接收的两个参数对content表public_id进行批量更新。最后导出用户选择的数据。

二、实现

如何解决新增之后，立即查询修改，vue只能查询修改到新增前的旧数据？

错误代码：

exportSubmitForm() {
      // 新增数据至期间表
      this.$refs["form"].validate(valid => {
        if (valid) {
          addPublic(this.form).then(response => {
            this.getPublicList();
            this.exportList();
          });
        }
      });
    },
    /** 查询期间表列表并以此更新content表Public_id */
    getPublicList(); 
    this.publicList = response.rows;
    this.publicNum = response.total-1;
    updatePublicId(this.publicList[this.publicNum].id,this.ids);//根据数组更新期间核查计划表的Public_id
    this.loading = false;
      });
    },
    exportList(){
      listContent();
        // 导出
        let contentNum=this.ids.length;
        if(contentNum<1){
          this.$message.error('未选择需要导出的期间核查信息，请勾选需要导出的期间核查信息！');
        }
        else{
          exportContent(this.ids).then(response =>{
            let data = new Blob([response], { type: 'application/msword,charset=utf-8' });
            if (typeof window.chrome !== 'undefined') {undefined
              // chrome
              const link = document.createElement('a');
              link.href = window.URL.createObjectURL(data);
              link.download = this.getDateStringForFileName()+"期间核查计划";
              link.click();
            }
          })
        }
      });
      this.exportShow = false;
    },

正确代码：

/** 导出操作 */
    exportSubmitForm() {
      // 新增数据至期间表
      this.$refs["form"].validate(valid => {
        if (valid) {
          addPublic(this.form).then(response => {
            this.getPublicList();
            this.exportList();
          });
        }
      });
    },
    /** 查询期间表列表并以此更新content表Public_id */
    getPublicList() {
      this.loading = true;
      listPublic({ //查询期间表
        pageNum: 1,
        pageSize: 999
      }).then(response => {
        this.publicList = response.rows;
        this.publicNum = response.total-1;
        updatePublicId(this.publicList[this.publicNum].id,this.ids);//根据数组更新期间核查计划表的Public_id
        this.loading = false;
      });
    },
    exportList(){
      listContent().then(response =>{//查询获取期间核查导出数据
        // 导出
        let contentNum=this.ids.length;
        if(contentNum<1){
          this.$message.error('未选择需要导出的期间核查信息，请勾选需要导出的期间核查信息！');
        }
        else{
          exportContent(this.ids).then(response =>{
            let data = new Blob([response], { type: 'application/msword,charset=utf-8' });
            if (typeof window.chrome !== 'undefined') {undefined
              // chrome
              const link = document.createElement('a');
              link.href = window.URL.createObjectURL(data);
              link.download = this.getDateStringForFileName()+"期间核查计划";
              link.click();
            }
          })
        }
      });
      this.exportShow = false;
    },

三、总结

不能新增之后只通过 listPubic()、listContent() 函数来查询数据，然后直接对数据进行操作。而是要通过如下形式，真正获取到查询的数据进行操作。这样才能解决只能修改旧数据的问题。

listContent().then(response =>{

}),