* 在`components`中新建權限組件`Authorized.vue`組件
```
<script>
import { check } from "../utils/auth";
export default {
// 函數式組件
functional: true,
props: {
authority: {
type: Array,
required: true,
},
},
render(h, context) {
const { props, scopedSlots } = context;
return check(props.authority) ? scopedSlots.default() : null;
},
};
</script>
```
* 權限組件在各個組件使用到，注冊成為全局組建,在`main.js`中添加
```
import Authorized from "@/components/Authorized";
Vue.component("Authorized", Authorized);
```
* 在`src/layouts/BasicLayout.vue`引入權限組件
~~~
<Authorized :authority="['admin']">
<setting-drawer />
</Authorized>
~~~
* 當前用戶權限為admin時可以看到動態布局按鈕，其他權限將看不到
