Avue使用的小细节

安装

1、备注:以下是介绍vue2版本的使用方法,vue3版本的后期更新

2、官网地址:v2.avuejs.com/docs/instal...

3、安装

js 复制代码
npm i @smallwei/avue@latest-v2 -S
yarn add @smallwei/avue@latest-v2 -S

//需要先安装ElementUI的依赖
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import Avue from '@smallwei/avue';
import '@smallwei/avue/lib/index.css';
Vue.use(ElementUI)
Vue.use(Avue);

4、具体配置可以看官网

注意的小细节

1、使用它的"编辑"功能,且在编辑弹窗中"自定义表单"时,需给表格加上 v-model 变量

例如:(以下的代码我使用的是类的写法,不用在意前面的前缀)

2、在编辑弹窗中,不同组件之间的交互

js 复制代码
control:(val, form) => {} // val:自己这个组件当前的值,form:整个表单的字段跟值
//(注意要修改的话,只能拿这个form的来改,才是响应式的,不能拿外面自己定义的prizeForm这个字段来改)

注意:一些不需要展示的字段不用在option中配置,可以在初始时在表单字段prizeForm中定义、或者用$set()来加这个属性,两种方式都是为了实现响应式

方式一:

方式二:

3、打开表单之前:

before-open:传函数,可以修改表单prizeForm值的数据,获取打开的类型,控制是否要打开

相关推荐
笨笨狗吞噬者12 分钟前
小程序包体积分析利器 -- vite-plugin-component-insight
前端·微信小程序·uni-app
吴声子夜歌13 分钟前
Vue3——v-for指令
前端·javascript·vue
你的牧游哥17 分钟前
Cursor IDE Rules / Skills / Subagents 前端项目配置全指南
前端·ide
音仔小瓜皮20 分钟前
【Vue】什么时候用Ref?什么时候用shallowRef?
前端·javascript·vue.js
码喽7号22 分钟前
vue学习五:前端路由VueRouter
前端·vue.js·学习
史迪仔011224 分钟前
[QML] 交互事件深度解析:鼠标、键盘、拖拽
前端·c++·qt
ZC跨境爬虫28 分钟前
海南大学交友平台开发实战 day11(实现性别图标渲染与后端数据关联+Debug复盘)
前端·python·sqlite·html·json
GISer_Jing30 分钟前
前端JS面试6大核心考点详解
前端·javascript·面试
ai大模型中转api测评32 分钟前
2026年前端新工具:Gemini 3.1 SVG工作流从Prompt到部署
前端·人工智能·prompt·api
yyuuuzz36 分钟前
独立站搭建:从基础到避坑的实战分享
前端·javascript·github