在这之前请看我上一篇博客https://blog.csdn.net/qq_41594146/article/details/83381964,这里有思路和数据库设置,之前做的是没有组件化,也就是单纯的v-for循环直接显示,刚刚写了按钮权限的组件,现在贴上代码\

    var  myButton=Vue.extend({//设置标签
        props:['names','item2'],//names为按钮名,item2为数据
        template:'<span><span v-for="obj in item2" v-if="obj.name==names" v-html="obj.code"></span></span>'
    })
    Vue.component('my-button',myButton);//注册组件

在页面上使用:

 <my-button names="删除" v-bind:item2="btdata" ></my-button>
 <my-button names="修改" v-bind:item2="btdata" ></my-button>

如果该角色有这个权限,则显示,没有则不显示