# vue2-permission

> ## 说明 > 该插件用于权限控制，根据不同的权限，显示不同的控件，常用于页面中按钮级别的权限控制，也可以用于数据表格权限的控制

Latest version **0.2.2** (published 2021-08-12) · 0 weekly downloads

## Install

```sh
npm install vue2-permission
pnpm add vue2-permission
yarn add vue2-permission
bun add vue2-permission
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.2 |
| Published | 2021-08-12 |
| First published | 2021-08-12 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 329 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | mmyhs |

## Links

- npm: https://www.npmjs.com/package/vue2-permission
- npm.io page: https://npm.io/package/vue2-permission

## Dependencies (2)

- [vue](https://npm.io/package/vue.md) ^2.6.11
- [core-js](https://npm.io/package/core-js.md) ^3.6.5

## Recent versions

- 0.2.2 (latest) — 2021-08-12
- 0.2.1 — 2021-08-12
- 0.2.0 — 2021-08-12
- 0.1.0 — 2021-08-12

## README

# vue2-permission

## 说明
> 该插件用于权限控制，根据不同的权限，显示不同的控件，常用于页面中按钮级别的权限控制，也可以用于数据表格权限的控制

## 安装
```shell script
yarn add vue2-permission
// or
npm install vue2-permission --save
```

## 使用教程
### 使用指令模式
```js
import { vuePermission } from 'vue2-permission';
Vue.use(vuePermission, {
  // 配置权限，默认从路由中读取
  permissions: ['select', 'delete', 'create', 'insert', 'upload', 'download'],
});
```

> 在vue文件中使用
```vue
<HelloWorld msg="Welcome to Your Vue.js App" v-permission.select />
```

### 使用组件模式
```js
import { VuePermission } from 'vue2-permission';
Vue.component(VuePermission);
```

```vue
<VuePermission :permissions="permissions" :all-permissions="allPermissions">
  <HelloWorld msg="Welcome to Your Vue.js App" />
</VuePermission>

export default {
  name: 'App',
  data() {
      return {
        permissions: ['select'], // 当前需要的权限
        allPermissions: ['select', 'delete', 'create', 'insert', 'upload', 'download'], // 当前页面存在的权限
      };
  },
}
```

## 注意
> 该插件只能在vue中使用
> 基于vue和vue-router
> 需要在vue-router中配置路由的时候，配置上对应的路由权限
```js
const routes = [
  {
    path: '/login',
    name: 'Login',
    component: Login,
    meta: {
      permissions: ['select'],
    },
  },
  {
    path: 'home',
    name: 'Home',
    component: Home,
    meta: {
      permissions: ['select', 'create'],
    },
  }
];
```

---
_Source: https://npm.io/package/vue2-permission · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._