三目运算符来解决按钮显示内容不一问题

1.三目运算符

{{ type === 'add' ? '新增供应商联系人' :( type === 'detail' ? '供应商联系人详情' : '编辑供应商联系人' ) }}

2.调用

<div slot="title" class="dialog-header">耗材{{ title[type] }}</div>

 data() {
    return {
      title: {
        detail: '查看',
        edit: '编辑',
        add: '新增'