![](https://img-blog.csdnimg.cn/20201127164723656.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
Vue + elementUi
无情无疫
个人学习博客,
目前方向:后端(python) + 前端(vue + elementUi)。
展开
-
el-table-column 由于加了if判断 切换标签页时表头顺序不一致
解决前切换标签页后 表头顺序与原来的顺序不一致解决后解决办法加 key<el-table-column v-if="currentView === '2'" :key="Math.random()" prop="companyName" label="单位" width="180"></el-table-column>...原创 2021-03-15 09:00:41 · 449 阅读 · 2 评论 -
el-table 使用sort-method 自定义排序详解
el-table 指定字段 进行自定义排序 详解原创 2021-03-12 14:42:01 · 11433 阅读 · 2 评论 -
async和await的使用
async queryFireControlState () { let stateArr = [] for (let item of this.tableData) { let res = await doorDevStatus({maindevId: item.deviceID}).then(res => { if (res.code === '00000') { if (!res.data) { return {ID:.原创 2021-03-09 09:51:14 · 286 阅读 · 4 评论 -
el-table 多选是否置灰
按条件判断,控制多选是否置灰原创 2021-02-01 15:21:35 · 1511 阅读 · 4 评论 -
解决:Duplicate keys detected: ‘xxx‘. This may cause an update error
vue遇到的一个坑错误日志翻译错误代码解决错误日志翻译错误代码<el-table border :data="ruleDetailList" style="width: 100%; margin-top:10px" v-if="ruleDetailList.length"> <el-table-column label="xxx" prop="parkName"></el-table-column> <el-table-column labe原创 2021-01-28 11:17:31 · 2048 阅读 · 2 评论 -
elementUi 日期时间选择器遇到的一个坑
添加value-format属性后的坑前言看图代码解决结尾前言今天遇到一个日期时间选择器的坑, 选择的时间是00:00:00 点击确定后变成12:00:00找了一会 也没发现是哪里有问题,当我把 value-format属性删除后 发现正常了, 就是value-format造成的。看图代码<el-form-item label="审核时间" class="create-time-item"> <el-date-picker v-model="checkTi原创 2021-01-08 11:27:07 · 3821 阅读 · 5 评论 -
vue 解决当数据发生变化但页面没有变化
阅读以下两篇文章this.$setthis.$nextTick原创 2020-12-22 09:47:54 · 1895 阅读 · 7 评论 -
解决el-button 鼠标按下和松开事件无效
el-table对原生事件无效原因解决原因因为element只对click事件做了封装,所以鼠标按下 松开等事件在el-button中无效解决解决方法很简单 加 .native。native 监听组件根元素的原生事件, 主要是给自定义的组件添加原生事件。<el-button circle class="el-icon-caret-top" id="PointerIcon" @mousedown.native="start('to_right_up')" @m原创 2020-11-24 17:21:08 · 2929 阅读 · 2 评论 -
element icon图标方向旋转
icon图标方向旋转前言上代码效果前言任务如下:elementUi的icon图标如下:所以没有左上 右上 左下以及右下的图标,正思考要换图标时,同时一句话让我醍醐灌顶,他说你可以给图标方向旋转啊,比方说左旋转45度 就成了左上,哇 666上代码<el-col :span="13"> <el-row> // 左上 我们用左图标加旋转45度实现,然后使用id标签定位。 <el-col :span="5"><el-button原创 2020-11-24 11:22:21 · 5515 阅读 · 1 评论 -
element 一个按钮多个选项事件
同一按钮不同事件前言上代码结尾前言任务:点击查看按钮,弹出窗口;悬浮查看按钮 显示下拉选项,选择不同选项触发不同事件上代码<el-table-column label="操作"> <template slot-scope="scope"> // 这里的command事件 是选择下拉选项时触发 <el-dropdown @command="handleMore"> // 这里的click事件是 点击查看时触发 <el-butto原创 2020-11-19 18:12:57 · 1214 阅读 · 2 评论 -
el-table 表头添加icon图标并悬浮提示
表头添加icon图标并悬浮提示前言开工第一种方法第二种方法效果前言任务:当鼠标移动到“门锁状态”的 图标时,弹出提示“xxxxxx”,鼠标移开该提示语消失。开工第一种方法<el-table-column :render-header="renderHeader" label="门锁状态" prop="state"></el-table-column> methods: { renderHeader (h, {column}) { // 悬原创 2020-11-18 16:34:04 · 5220 阅读 · 2 评论 -
Vue 自定义验证之日期时间选择器
现有需求 查询条件中 当 开始时间 结束时间选择同一时间时 提示结束时间大于开始时间期望效果表单<el-form :inline="true" :rules="rules"> <el-form-item label="创建时间" prop="createTime" class="create-time-item"> <el-date-picker v-model="createTime" type="原创 2020-10-29 15:49:41 · 2185 阅读 · 1 评论 -
element 输入䀚时 提示只支持中英文
验证中英文的正则表达式如下:后来发现 “䀚”字的 Unicode编码为:\u401a ,不在 [\u4e00-\u9d5] 范围内,属于 CJK Unified Ideographs Extension A ,它的位置在 [\u3400-\u4db5] ,所以验证失败原创 2020-10-23 09:28:43 · 389 阅读 · 2 评论 -
el-tree 懒加载
<el-tree :props="defaultProps" :load="loadNode" lazy @node-click="selectDeptTreeNode" // 点击节点时触发 :filter-node-method="filterNode" // 关键字过滤 ref="personDeptTree"></el-tree>双向绑定值 defaultProps: { children: 'subs'原创 2020-10-21 10:42:14 · 1606 阅读 · 6 评论 -
vue调试工具vue-devtools的安装
按照网上教程 装了一上午的vue-tools 也没能成功, 发现 网上大多教程都是克隆的dev分支, 但dev分支并没有shells文件, 所以一直失败dev分支这是master分支这是v 5.1.1分支以v 5.1.1 分支为例 进行安装第一步 克隆指定分支的vue-toolsgit clone -b v5.1.1 https://github.com/vuejs/vue-devtools.git第二步 进入新创建的文件夹cd vue-devtools第三步 安装依赖原创 2020-10-21 11:18:14 · 554 阅读 · 4 评论 -
保留n位小数并四舍五入
语法number.toFixed(x)x 为必须参数 是 0 ~ 20 之间的值,包括 0 和 20,如果省略,将用 0 代替。number 必须为数字或浮点数, 如若不是 可以使用parseFloat 转一下类型返回值为 String 类型自动做四舍五入示例a = 1.538491.53849a.toFixed()"2"a.toFixed(1)"1.5"a.toFixed(2)"1.54"a.toFixed(3)"1.538"b = '14.82519'"14.8原创 2020-10-20 15:29:37 · 376 阅读 · 2 评论 -
Vue npm run dev启动时报错
报错内容如下:There are multiple modules with names that only differ in casing.翻译:有多个模块的名称仅在大小写上有所不同。This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.翻译:在具有其他区分大小写的文件系统上进行编译时,这可能导致意外的行为。Use equal casing. Compare t原创 2020-09-14 09:46:25 · 475 阅读 · 2 评论 -
Django + Vue跨域
①Django代码块首先查询数据def find_all(request): 获取vue传的值name =request.GET.get("name")if name: data = models.Spiders.objects.filter(name=name) var=serializers.serialize('json',data) #将结果集转换成js...原创 2019-05-22 20:30:46 · 654 阅读 · 2 评论