背景:
需求是:在vue框架中,接口传参我们需要穿“变量名”,而不是字符串
通俗点说法是:在网络接口请求的时候,要传属性名
效果展示:
vue2核心代码:
this[_keyParam]
vue3核心代码:
[_keyParam]
//封装方法
const filtertreeLocationSelect = async(filterVal, item )=> {if (!filterVal) return;const _keyParam = item.filterablePrama.keyParam// console.log('_key>>>',_keyParam,typeof _keyParam,33,this[_keyParam]);console.log('_key>>>',_keyParam,typeof _keyParam,33,[_keyParam]);//后端接口await handleSubFilter(item, {[_keyParam] : filterVal });
};
完整使用案列:
const item = {type: "treeLocationSelect",label: "渡口名称",key: "dkId",url: "/data/ferryPort/pageData",methed: "post",optionParam: {label: "name",value: "pid",},optionsData: [],moreparams: {pageNum: 1,pageSize: 99999,},headers: {headers: {"Content-Type": "application/json",},},default: store.selectAreaId,limit: "有联动",filterable: true,filterablePrama:{keyParam:'name'},},
//调用封装方法:
filtertreeLocationSelect(filterVal,item )