Vue的computed属性中方法带参数的写法记录
computed是计算属性,如果带参数怎么办? 可以按照如下写法Vue.component("mulit-table-operation", {mixins: [mixin],template: `<span><el-tooltip v-for="(item,index) in field":conte...
·
computed是计算属性,如果带参数怎么办? 可以按照如下写法
Vue.component("mulit-table-operation", {
mixins: [mixin],
template: `<span>
<el-tooltip v-for="(item,index) in field"
:content="getItemName(item)"
:key="index"
placement="top">
<el-button type=""
:class="getItemClass(item)"
size="mini"
circle
@click.stop.prevent="operation(item)">
</el-button>
</el-tooltip>
</span>`,
computed: {
getItemName() {
return function(item) {
let r_name = item.b_name[0];
if (item) {
const p_name = item.p_name;
const p_value = item.p_value;
if (this.rowData && p_value) {
let _this = this;
p_value.forEach(function(a, index) {
if (_this.rowData[p_name] == a) {
r_name = item.b_name[index];
return;
}
});
}
}
return r_name;
};
},
getItemClass() {
return function(item) {
let r_name = item.classname;
if (item.classname instanceof Array) {
r_name = item.classname[0];
if (item) {
const p_name = item.p_name;
const p_value = item.p_value;
if (this.rowData && p_value) {
let _this = this;
p_value.forEach(function(a, index) {
if (_this.rowData[p_name] == a) {
r_name = item.classname[index];
return;
}
});
}
}
}
//特殊的业务处理,不影响其他组件的正常使用
if (
item.show_juje &&
this.rowData.p_uid &&
this.rowData.p_uid != ctool.getUserId()
) {
r_name = "hideButton";
}
return r_name;
};
}
}
});
其中getItemClass和getItemName就是带了入参,在computed中定义方法时,通过内部return一个function的方式可是满足需要。
更多推荐
已为社区贡献12条内容
所有评论(0)