保存暂存接口复用

最新推荐文章于 2024-02-03 22:43:05 发布

小陈同学，，

最新推荐文章于 2024-02-03 22:43:05 发布

阅读量266

点赞数

分类专栏： vue3.0 文章标签： javascript 前端 vue.js

本文链接：https://blog.youkuaiyun.com/ping_lvy/article/details/126369231

版权

vue3.0 专栏收录该内容

33 篇文章

订阅专栏

这篇博客介绍了如何在前端开发中实现保存和暂存功能，这两个操作调用同一接口但提示信息不同。通过设置不同的状态值并验证表单，实现了`tempSave`和`billSave`两个方法，分别对应暂存和保存。`addBaseContractData`接口负责根据状态决定调用`savePmContractChange`或`updatePmContractChange`，并返回操作结果。

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

需求：保存和暂存需要调一样的接口，但是提示语不一样

    /** 暂存 */
    const tempSave = async () => {
      contractData.formData.pmContract.process_status = 1;
      let billData: any = { ...contractData.formData, ...contractData.dataSource };
    
      const res: any = await addBaseContractData(billData);
      if (res) {
        message.info('暂存成功');
        goBack();
      }
    };


    /** 保存 */
    const billSave = async () => {
      createFormRef.value
        .formValide()
        .then(async () => {
          contractData.formData.pmContract.process_status = 0;
          let billData = {
            ...contractData.formData,
            ...contractData.dataSource,
          };
         
          const res: any = await addBaseContractData(billData);
          if (res) {
            message.info('保存成功');
            goBack();
          }
        })
        .catch(() => {
          console.log('必填项未必填');
        });
    };

此时返回true 再在方法里分别写，就不用判断是暂存还是保存


    /** 保存接口 */
    const addBaseContractData = async (data = {}) => {
      let res: any;

      if (contractData.isChange === '1') {
        res = await savePmContractChange(data);
      } else {
        res = await updatePmContractChange(data);
      }

      if (res.status_code == '0000') {
        return true;
      } else {
        message.error(res.reason);
        return false;
      }
    };