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值的数据,获取打开的类型,控制是否要打开

相关推荐
程序员黑豆5 小时前
Java 注释详解:单行、多行与文档注释的完整指南
java·前端·ai编程
剪刀石头布啊5 小时前
antd中可编辑表格中巧用useWatch实现联动高性能效果,以及定制延伸学习
前端
油丶酸萝卜别吃6 小时前
前端转全栈学习路线
前端·学习
浮生望6 小时前
前端路由进阶:History API原理与手写HistoryRouter
前端
陆枫Larry7 小时前
JavaScript 中的竞态是什么,为啥会有竟态?
前端
上海安当技术9 小时前
半天接入:USBKey RESTful API + C 动态库,Web 和 C/S 两套集成路径实战
前端·后端·restful·集成·usbkey
DevUI团队9 小时前
从“即兴创作”到“规格先行”,华为云码道(CodeArts)代码智能体持续深耕企业级规范驱动开发能力
前端·人工智能·后端
weixin_4316004410 小时前
NestJS 入门(3):Guard 如何挡住未登录请求?
前端·后端·学习·nest.js
kyriewen10 小时前
我用Claude Code两天干完了团队两周的排期——周报发出去那一刻我就后悔了
前端·javascript·ai编程
IT_陈寒11 小时前
JavaScript类型转换把我坑惨了,这破玩意真该早点搞明白
前端·人工智能·后端