vue-mixin的简单使用

60 阅读1分钟

需求是按钮权限的限制,后端给我返回一个按钮权限标识的集合,我将完整的数据放入data定义好,后续根据不同用户不同角色的当前页面按钮权限标识进行一个v-if的限制,禁用属性可以使用过滤器但是v-if不可以,所以对v-if我将使用mixin混入来达到少写代码的目的(虽然也没有多少) 先定义一个mixin文件夹放入index.js文件

image.png

导出mixin(个人觉得就是一个js模块)

  data () {
    return {
      name: 'mixinbutton'
    }
  },
  mounted () {
  },
  methods: {
    mixfilterbutton (val, cal) {
      if (val === cal) {
        return false
      }
      return true
    }
  }
}

组件使用

image.png 然后我们可以使用这里面的方法了

image.png