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 分钟前
给 AI Agent 装上"长期记忆":Karpathy 的 LLM Wiki 思想,我做成了工具
前端·后端·ai编程
竹林81810 分钟前
用ethers.js连接MetaMask实现Web3钱包登录:从踩坑到稳定运行的完整记录
前端·javascript
heyCHEEMS13 分钟前
如何用 Recast 实现静态配置文件源码级读写
前端·node.js
心连欣14 分钟前
从零开始,学习所有指令!
前端·javascript·vue.js
review4454317 分钟前
大模型和function calling分别是如何工作的
前端
东东同学18 分钟前
耗时一个月,我把 Nuxt 首屏性能排障经验做成了一个 AI Skill
前端·agent
冴羽1 小时前
超越 Vibe Coding —— AI 辅助编程指南
前端·ai编程·vibecoding
梦想的颜色2 小时前
一天一个SKILL——前端最佳自动化测试 webapp-testing
前端·web app
SoaringHeart2 小时前
Flutter进阶:放弃 MediaQuery.of(context) 使用 NScreenManager
前端·flutter
openKaka_2 小时前
从 scheduleUpdateOnFiber 到 Root 微任务调度:React 如何把更新交给调度系统
开发语言·前端·javascript