vue.js
项目实战 踩坑Vue
挺哥的踩坑之旅
5年工作经验;MES整体解决方案方向;Oracle、postgresql基础应用、Java开发、Vue框架使用、数据可视化设计。
展开
-
el-table的fixed属性导致表格错位的问题(已解决)
在引入element UI 的table组件使用过程中,业务需求要实现某列的固定,类似于excel的冻结窗口功能。这里官方提供的方式是 给 el-table的<el-table-column> 添加 fixed属性,添加后,该列不会随着横向滚动而滚动。如图所示,浅蓝色应该是对齐的。发生错位的原因,是由于table在数据请求后,渲染异常的问题;因此,解决办法就是让table重新布局。这里官方提供了doLayout方法,来解决重新布局的问题doLayout的使用方式找到请求数据的地方原创 2020-06-12 01:42:14 · 21108 阅读 · 9 评论 -
elSelect点击空白处无法收起下拉框(失去焦点并隐藏)
初次使用elSelect这个组件的时候,会碰到无法实现 当下拉菜单处于展开状态时,如不点击到组件上,无法收起下拉菜单的情况。如下图,点击空白区域,只会触发html的默认事件这里博主亲测可用的解决办法是:官方的Select组件提供了“blur” 方法,并借助 “v-click-outside”方法实现在main.js中,进行全局注册自定义指令Vue.directive(‘click-outside’, {bind: function (el, binding, vnode) {el.cl原创 2020-06-02 13:24:22 · 10029 阅读 · 5 评论 -
echarts - 堆叠图进阶处理
堆叠图 “重叠”和 “堆叠” 的处理堆叠需要堆叠在一起的每个bar,都具有属性值 stack:‘相同值’重叠需要重叠在一起的每个bar,都具有属性值 barGap:’-100%’原创 2020-06-02 13:02:39 · 396 阅读 · 0 评论 -
Vue el-Select自定义封装(实例)
因项目需要,基于element UI 再封装了 select选择器,现记录如下:1、新建vue文件,用于存储模板,同时我暴露了参数,和方法供父组件调用<template> <el-select v-model="value2" multiple :placeholder="placeHolder" collapse-tags @visible-change="changeValue1($event,value2)" @change="原创 2020-05-21 11:27:31 · 3094 阅读 · 0 评论 -
vue.js知识点-transition-group的应用(实例展示)
transition只能用于单个元素的动画,list等多元素的动画要使用transition-group头条-静敏的编程秘诀-vue教程合集知识点1:style的组合使用入场动画.v-enter, .v-leave-to { opacity: 0; transform: translateY(80px); }其中 op...原创 2020-03-12 16:31:06 · 467 阅读 · 0 评论 -
vue.js知识点-transition的钩子函数应用(实例展示)
本小结通过transition的钩子函数实现小球半场动画头条-静敏的编程秘诀-vue教程合集知识点1:入场、出厂方法beforeEnter表示动画入场之前,此时,动画尚未开始,可以在beforeEnter中设置元素开始动画之前的起始样式enter表示动画开始之后的样式,这里可是设置小球完成动画之后的,结束状态enter(el,done)el:动画钩子函数的第一个参数:el,...原创 2020-03-12 13:05:40 · 1780 阅读 · 0 评论 -
Vue.js 指令(2)
eval()返回字符串计算结果eval('2'+'3')结果 为 5用class添加元素样式的几种方式:直接上例子<style> .red { color: red; } .thin { font-weight: 200; } .italic { font-style: italic...原创 2020-03-03 23:23:21 · 163 阅读 · 0 评论 -
Vue.js指令(1)
v-cloak解决差值表达式的闪烁问题所有使用v-cloak 的元素,都将 display:none<p v-clock> {{msg}}</p> v-text它和v-cloak的区别:1、没有闪烁问题2、{{msg}} 的前后可以添加任意内容,只替换占位符的内容。而v-text会覆盖元素中原本的内容<h4 v-text="msg">&l...原创 2020-03-02 17:13:09 · 187 阅读 · 1 评论