随笔分类 -  Vue

上一页 1 2 3
Vue更改v-html中CSS样式
摘要：Vue更改v-html中CSS样式 <div class="imgBox" v-html="helpInfo.content" style="padding-bottom:20px"></div> 其中v-html为img标签，有一张图片 元素样式为CSS写法 /*css*/ <style scop 阅读全文
posted @ 2020-08-06 19:24 盼星星盼太阳 阅读(2244) 评论(0) 推荐(0)
v-for与v-if结合使用问题
摘要：场景： 1.为了过滤一个列表中的项目 (比如 v-for="user in users" v-if="user.isActive")。在这种情形下，请将 users 替换为一个计算属性 (比如 activeUsers)，让其返回过滤后的列表。 2.为了避免渲染本应该被隐藏的列表 (比如 v-for= 阅读全文
posted @ 2020-08-04 11:15 盼星星盼太阳 阅读(2941) 评论(0) 推荐(0)
el-table表头宽度自定义
摘要：场景： 1. 某列表头文字内容过长，要对每列表头自定义宽度 2. 表格row的每一column文字不换行，超过列宽则省略，mouseover有提示 3. 对于label做滤值处理 <template> <el-row> <el-col :span="24"> <template> <el-table 阅读全文
posted @ 2020-08-01 16:31 盼星星盼太阳 阅读(1354) 评论(0) 推荐(0)
el-table嵌入表单元素注意事项（验证规则prop写法与数据初始化）
摘要：场景：在el-table表格中嵌入表单元素，写法如下 注意两点：动态生成 el-form-item的 prop 以及给el-form-item设置rules属性 一、一般v-for循环生成表单元素，prop验证规则写法 :prop写法如下 <div v-for="(v, i) in standard 阅读全文
posted @ 2020-08-01 16:23 盼星星盼太阳 阅读(2466) 评论(0) 推荐(0)
elementui表单元素change时调用接口，表单规则验证接口数据
摘要：场景：elementui表单元素change时调用接口获取接口数据之后，表单规则验证接口数据 change函数在调用接口获取数据之后，利用validateField，单个元素进行验证接口数据 1.页面元素 <el-form-item label="xxxx" prop="projectId"> <e 阅读全文
posted @ 2020-08-01 16:11 盼星星盼太阳 阅读(1826) 评论(0) 推荐(0)
elementui表单多元素验证结合防抖
摘要：场景：elementui进行表单验证时，多个输入框同一个验证规则，此时弹窗验证提示消息会出现多条，此时需要运用防抖解决； 场景一：提交表单，只用弹窗提示消息，无需输入框下方提示； 1.字段 rules:{ ****: [ { required: true, message: "xxxx", trig 阅读全文
posted @ 2020-08-01 16:06 盼星星盼太阳 阅读(1932) 评论(0) 推荐(1)
vue中ref的用法
摘要：ref 的用法： 1、ref 加在普通的元素上，用this.ref.name 获取到的是dom元素 2、ref 加在子组件上，用this.ref.name 获取到的是组件实例，可以使用组件的所有方法。 3、利用 v-for 和 ref 获取一组数组或者dom 节点 注意点： 1、ref 需要在dom 阅读全文
posted @ 2020-08-01 15:17 盼星星盼太阳 阅读(5268) 评论(0) 推荐(0)
axios结合async await与promise的使用方法（异步转同步）
摘要：场景：页面开始加载调用多个接口，并且需等待上一次请求完成，再调用下一个接口.(未二次封装axios) 想利用async...await实现 async created() { await this.getBank(); ...... await this.getAccountInfo(); .... 阅读全文
posted @ 2020-08-01 14:45 盼星星盼太阳 阅读(7345) 评论(2) 推荐(0)
elementui设置el-table-column宽度百分比
摘要：1.el-table-column不设置width与minwidth,每一列自适应，宽度一致 2.el-table-column设置width=30%，无效。 el-table 组件会被 vue 解析成 html， width 设置百分比的值直接被解析去掉百分号变成 px 了 3.el-table- 阅读全文
posted @ 2020-07-17 15:46 盼星星盼太阳 阅读(21788) 评论(2) 推荐(4)
Vue兼容IE文件上传
摘要：使用jQuery中的ajaxSubmit方法 页面结构如下： <el-link type="primary"> <label for="recordExcel">xxxx&ensp;|</label> </el-link> <form id="recordExcelForm" style="disp 阅读全文
posted @ 2020-07-17 15:10 盼星星盼太阳 阅读(466) 评论(0) 推荐(0)
Vue隐藏input file的三种方法
摘要：1.使用HTML的lable机制触发input事件 lable上的for属性绑定input的id,即可通过触发lable上的点击事件触发input的change事件 <el-link type="primary"> <label for="recordExcel">上传文件|</label> </e 阅读全文
posted @ 2020-07-17 14:54 盼星星盼太阳 阅读(5761) 评论(0) 推荐(0)

上一页 1 2 3