VUE
御风傲天
IT前端码农
展开
-
element表单内嵌表格,table多行数据自定义校验以及自定义传参
element表单多行数据自定义校验以及自定义传参原创 2022-09-16 17:26:45 · 962 阅读 · 1 评论 -
element 去掉form表单的某一项单个form-Item校验
element 去掉form表单的某一项单个校验原创 2022-08-13 11:08:36 · 6201 阅读 · 0 评论 -
elementUI踩坑之 table表格当前行row修改数据,视图不更新
1.先看业务场景,table表格每一行中,WWN,是下拉框选项选择T2-10000.。。。选项,数据改变了但是,页面视图没有改变1.注意事项,element表格当前行数据,属性修改;无法更新视图,是由于table监听的是一行数据,而不是某个单元格属性这里需要我们主动触发页面更新,可以用到$set方法。我们可以使用$set()方法,既可以新增属性,又可以触发视图更新。上面的三个参数分别是:data是表格的数据源,index是修改row当前行的索引,row是改后的数据类似...原创 2021-12-15 14:47:56 · 5315 阅读 · 3 评论 -
element动态表格之自定义固定列、排序、筛选、导出等
element动态表格之自定义固定列、排序、筛选、导出等原创 2021-11-25 15:04:42 · 1186 阅读 · 1 评论 -
Vue中父子组件向弹出框里的子组件传值props不更新处理
父级组件中使用element的dialog <!-- 表格点击已用值弹窗 --> <el-dialog title="维度明细列表" top="10vh" :visible.sync="dialogTableVisible" :destroy-on-close="true" width="1000px" class="dialogTable" @close="closeDi原创 2021-08-04 16:19:15 · 1290 阅读 · 0 评论 -
vue 子组件调用父组件方法
业务场景:在使用vue开发的过程中,经常会用到,父组件是个表格list, 点击了一个新增按钮,弹个modal 里面子组件是个表单,新增完,子组件 调用 父组件方法,关闭弹框,重新获取数据部分主要代码如下:// 父组件<!-- 新增合约模块 --> <el-dialog :close-on-click-modal="false" title="创建智能合约" :visible.sync="addModalshow"原创 2021-02-04 17:08:01 · 403 阅读 · 0 评论 -
element dialog 子组件props存在缓存处理
在使用element-ui的dialog时,弹出窗内嵌套了一个子组件<el-dialog title="部署智能合约" :visible.sync="deployModalshow" width="600px" :destroy-on-close="true" > <v-deployContract @fatherMethod="deploySuccess" :deployName="原创 2020-12-03 15:45:39 · 1912 阅读 · 0 评论 -
二进制流文件下载
在做一些文件下载的时候,后端返回的二进制流文件,这里前端的兄弟姐妹就需要处理一下了。直接上代码:// 下载export function download(id) { return request({ url: `/rancher/download_contract/${id}`, method: "get" });}download(row.contractId).then(data => { // 二进制流转换 downl原创 2020-11-19 15:45:56 · 1361 阅读 · 3 评论 -
Avue-curd个性化定制
在使用vue(js)+elelment(ui)开发一些后台管理项目的时候,基本会用到 列表页,条件搜索(search),表格数据(table),分页,操作栏的,增、删、改、查几种操作。如下图这样的:很多的页面都很类似,这里就给大家介绍一个,我自己最近研究的一个插件 avue-curd;整体的一个模块,包含列表,增、删、改、查;还可以通过slot插巣自定义局部组件内容如下面,我按照产品自定义:隐藏了搜索模块、操作栏(这些都是可配置的)上代码:主页面<!--列表-->&l原创 2020-10-29 18:16:43 · 5344 阅读 · 2 评论 -
Input用户输入完后再执行方法
在开发过程中,input的用户输入的值,绑定的onchange事件,如果没敲一次键盘,执行一次方法,请求一次数据的话就很耗内存了;这里用一下lodash<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script><script src="https://cdn.jsdelivr.net/npm/lodash@4.13.1/lodash.min.js"><转载 2020-09-16 15:33:19 · 5991 阅读 · 1 评论 -
vue与element表格数据转换
业务场景:在后台管理系统表格模块中,我们请求回来的数据类似性别等等,后台给我们返的不是男,或者女,而是给我们返回的是0和1,或者是A和B;但是怎么在表格中显示成男和女呢,这里就需要用到数据转换 formatter属性1.第一步给返回的数据添加数据转换方法2.第二步在methods中写数据转换方法,此处为formatRole//数据转换 formatRole: functio...原创 2018-08-02 18:50:20 · 5246 阅读 · 0 评论 -
vue地址栏传参数以及接收参数
编程式的导航在用Vue开发项目中,跳转页面,除了使用 <router-link> 创建 a 标签来定义导航链接,我们还可以借助 router 的实例方法,通过编写代码来实现。// 字符串router.push('home')// 对象router.push({ path: 'home' })// 命名的路由router.push({ name: 'user', ...原创 2018-08-06 16:47:25 · 24025 阅读 · 0 评论 -
vue刷新当前页面,重载页面数据
业务场景:在管理后台,在执行完,增,删,改,操作的时候。我们需要刷新一下页面,重载数据。在JQ中我们会用到location.reload()方法,刷新页面;在vue中,这里需要用到一个 provide / inject 这对用例。(其他方法:this.$router.go(0),会强制刷新,出现空白页面体验不好)这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次...原创 2018-07-27 16:05:02 · 48285 阅读 · 23 评论 -
vue2.0那些坑之使用elementUI后v-on:click事件不生效问题
最近学习使用vue2.0,的过程中遇到了大大小小不少坑,这里讲一下v-on指令,我在项目中引入了elementUI,进行布局,代码如下:但是再出发外层盒子,点击事件时,但是没效果,检查代码,没错也没报错,就是没有点击效果,这里需要对click进行调整了换成@click.native=""所以在使用elementUI时,小伙伴们要注意一下。...原创 2018-05-30 14:06:50 · 19070 阅读 · 0 评论