dz2.1/src/components/AuthButton/index.vue

 <script>
export default {
  name: 'MenuItem',
  functional: true,
  props: {
    auth: {
      type: Object,
      require: true,
      default: () => { }
    },
    row: {
      type: Object,
      default: () => { }
    }
  },
  render (h, context) {
    const { auth, row } = context.props
    const vnodes = []
    if (auth && Object.keys(auth).length) {
      //获取按钮配置项
      const { servicetype, pagename, pageicon } = auth

      //根据服务类型显示按钮类型 1=查询 2=新增 3=编辑 4=删除
      const type = servicetype != '4' ? 'primary' : 'danger'

      //根据服务类型显示按钮类型设置按钮方法 1=查询 2=新增 3=编辑 4=删除 ...其他
      let func = null
      if (servicetype == 1) {
        func = () => context.parent.handleQuery()
      } else if (servicetype == 2) {
        func = () => context.parent.handleAdd()
      } else if (servicetype == 3) {
        func = (row) => context.parent.handleEdit(row)
      } else if (servicetype == 4) {
        func = (row) => context.parent.handleRemove(row)
      } else if (servicetype == 5) {
        func = (row, auth) => context.parent.handleOther(row, auth)
      }

      //根据显示方式显示按钮类型 1=名称 2=图标 3=名称+图标
      let button = null
      if (pageicon) {
        button = <el-button size="small" icon={pageicon} onClick={() => func(row, auth)} type={type}></el-button>
      } else {
        button = <el-button size="small" onClick={() => func(row, auth)} type={type}>{pagename}</el-button>
      }
      vnodes.push(button)
    } else {
      vnodes.push(<span></span>)
    }
    return vnodes
  }
}
</script>

<style scoped>
.sub-el-icon {
  color: currentColor;
  width: 1em;
  height: 1em;
}
</style>