avue 编辑弹框，编辑页面，列表数据也会跟着变

【vue】avue-crud行编辑 1.vue页面代码 <template> <avue-crud ref="crud" :option="option" :data="data" @row-update="rowUpdate"> <template slot-scope="{row,index}" slot="menu"> <el-button type="primary" icon="el-icon-edit" size="small"

这个会进入无限递归。

avue框架的使用(二) 1.avue中解决表单提交点击编辑弹框再次点击新增数据会将编辑数据代入新增弹框问题（avue表格自带的弹框） 解决方式： 在方法beforeClose中使用，代码如下 beforeClose(done){ //通过节点来控制 this.$refs.crud.resetForm(); }, 2.点击编辑弹框保存之后，表单输入框全部被禁用问题解决 在保存成功之后使用done方法 done() ...

在avue-crud,标签内自己写一个操作栏的按钮,通过 handleEdit() <template slot-scope="scope" slot="menu"> <el-button type="text" icon="el-icon-edit-outline" size="small" v-if="scope.row.meetType == '1' || scope.row.mee.

el-select v-model=“otherForm.departHour” placeholder=“请选择发车时段” @change=“val => onDepartHourChange(val, otherForm, row, index)”>排查问题发现v-model绑定值是变化的，刷新页面下次点击编辑可以回写上次选中的内容，说明只是vue没有监听到其变化，未刷新导致。classPlanId: null, // 行发车时段绑定的id,其表示当前的发车时段。

代码如下： //返回按钮 handleBack () { this.$router.$avueRouter.closeTag(); this.$router.back(); } //跳转 handleForm(id) { this.$router.push({ path: "/form-detail/index", query: { id: id } }); }

avue 列表单独对一列进行个性化设置；avue一列文字样式自定义;avue一列文字显示成按钮

参考官方文档：   配置数据中【$cellEdit为true】即可开启首次编辑addRowBtn为行新增按钮，cellBtn设置为true则开启行编辑按钮，在配置中将编辑的字段设置【cell为true】,增删改查方法和crud组件使用一致，rowKey为主键的key，如果数据中存在主键，数据才会保存在表格中。 个人实验下来，只有两步   1、Json数据中每个元素加上：$cellEdit:true 如： { id:0, sex:1, age:18, $cellEdit:true //

解决select选择器初始进入时也会触发 change 事件

说明： avue-crud组件中添加查询条件或者新增的时候，条件为下拉框且接口在curd组件中配置。2. tableOption的配置文件。

最终要实现的效果 双击某一行，出现下拉框进行编辑，然后保存 过程 1.在avue框架上添加@row-dblclick每一行的双击事件 2.在要编辑的option的column列添加change()事件，change事件中执行的是rowUpdate事件 代码 <template> <basic-container> <avue-crud ref="crud" :data="data" ..

不用表单的样式，主要在弹窗中实现单选框的选项，以Demo为主，供Vue2以及Vue3的Demo思路

cell、blulr，我在官网配置文档上并没有看到。可能是官网文档进行了升级，记得去年的时候官网配置项文档并不是如今这个样子，里面的配置项很多。不要以为官网上没有该属性的介绍就真的没有，要勇于质疑，自己可以先写着试下，总归会发现新大陆的。其次，avue 框架确实可以极大的提高开发者的效率，减少页面开发工作，但前提是你要熟悉 avue框架的各个配置项。因为它的配置项实在是太多了，如果不是太熟悉，真的不如使用 element 进行开发来的方便。