vue计算属性传参（computed）

 计算属性默认是无法传递参数的

主要用于对当前文件组件的数据(data/props)，进行操作，缓存当前计算属性的依赖

而有些情况需要使用到计算属性来传递参数，可以使用闭包函数：

computed: {
    // 获取数据进行操作
    computedValue() {
      return function(val) {
        console.log(val);
      };
    }
  }

举一个具体例子，项目需要发送文件消息，需要根据文件类型显示文件图标类型，更需要处理文件名称，使用计算属性传参：

页面：

              

                
                  
                  
                  
                  
                  
                  
                  
                  {{
                    SetLinkFileNameAndPath(item,'name')
                  }}
              

computed: {
    SetLinkFileNameAndPath() {// 动态加载文件名称路径及图标
      return function(item,n) {
        if(item) {
          if(n == 'name') {
            if(item.text.constructor === Object && item.text.constructor !== String) {
              let indexO = item.text.fileName.lastIndexOf(".");
              item.fileIcon = this.docIcon(item.text.fileName.slice(indexO + 1));
              return item.text.fileName;
            } else if(item.text.constructor === String && item.text.indexOf("{") != -1) {
              let indexS = JSON.parse(item.text).fileName.lastIndexOf(".");
              item.fileIcon = this.docIcon(JSON.parse(item.text).fileName.slice(indexS + 1));
              return JSON.parse(item.text).fileName;
            } else {
              let indexP = item.text.split("|")[1].lastIndexOf(".");
              item.fileIcon = this.docIcon(item.text.split("|")[1].slice(indexP + 1));
              return item.text.split("|")[1];
            }
          } else if(n == 'path') {
            if(item.text.constructor === Object && item.text.constructor !== String) {
              return item.text.filePath;
            } else if(item.text.constructor === String && item.text.indexOf("{") != -1) {
              return JSON.parse(item.text).filePath;
            } else {
              return item.text.split("|")[0];
            }
          }
        }
      }
    }
}

methods: {
    //文档图标
    docIcon(val) {
      if (["jpg", "png", "jpeg", "gif", "bmp"].includes(val)) {
        return "img";
      } else if (["zip", "rar", "7z", "jar", "cab"].includes(val)) {
        return "zip";
      } else if (["ppt", "pptx"].includes(val)) {
        return "ppt";
      } else if (["txt", "docx", "doc"].includes(val)) {
        return "txt";
      } else if (["pdf"].includes(val)) {
        return "pdf";
      } else if (["mp4"].includes(val)) {
        return "audio";
      } else if (["xls", "xlsx"].includes(val)) {
        return "xls";
      } else {
        return "default";
      }
    },
}

具体的数据操作是可以忽略的，理解具体的使用情景即可。