**表单显示隐藏** ***** ## 引入依赖 ``` import { usePermission } from '/@/hooks/web/usePermission'; const { hasPermission } = usePermission(); ``` hasPermission 函数接收后台权限编码,可传递数组hasPermission (['user:add']) ## BaseForm中使用方式 ### show方式控制 * **通过 [show](https://vvbin.cn/doc-next/components/form.html#formschema) 属性动态判断当前组件是否显示，css 控制，不会删除 dom** ``` { field: 'field1', component: 'Input', label: '字段1', show: ({ values }) => { return hasPermission('user:add'); } } ``` ### ifShow方式控制 * **通过 [ifShow](https://vvbin.cn/doc-next/components/form.html#formschema) 属性动态判断当前组件是否显示，js 控制，会删除 dom** ~~~ { field: 'field2', component: 'Input', label: '字段2', ifShow: ({ values }) => { return hasPermission('user:add'); } } ~~~ ## 插槽中使用方式 ~~~ <template #jSelectUser="{model, field }"> <JSelectUser v-model:value="model[field]" v-if="hasPermission('user:add')"/> </template> ~~~