实现如下效果,title不一样
如何实现
实现方法较复杂,但是有利于后续项目的维护,
1.首先新建一个js文件
export const OPERATING_STATUS = {
CREATE: 1, //新增
RENAME: 2, //重命名
SHOW:3, //详情展示
COPY:4, //复制
DELETE: 5,
MODIFY:6,
}
export const OPERATING_STATUS_TITLE = {
1: '新增',
2: '重命名',
3: '详情',
4: '复制',
5: '删除',
6: '修改',
}
2.将上述两个对象导入到.vue文件中
import {
OPERATING_STATUS
} from '@/libs/status.js'
3.实现
h('Button', {
props: {
type: 'primary',
size: 'small'
},
on: {
click: () => {
this.showModalHandler(OPERATING_STATUS.RENAME)
}
}
}, '重命名')
methods:
methods: {
showModalHandler(tag) {
this.modalTitle = OPERATING_STATUS_TITLE[tag]
this.showModal = true
},