Vue
神经介质
这个作者很懒,什么都没留下…
展开
-
Handsontable添加操作按钮
需求: 要求表格第一列添加删除按钮,点击按钮删除该行数据。并且前三列固定在左侧不随着滚动条滚动,前三列内容不能编辑。<template> <div id="app"> <hot-table ref="hotOfGoal" id="hot" :settings="goalHotSettings"></hot-table> </div></template>步骤一: 固定左侧前三列不能水平滚动,设置属性 fixed原创 2021-04-29 11:07:08 · 1700 阅读 · 3 评论 -
解决echarts x轴数据太多造成重叠的问题
解决echarts x轴数据太多造成重叠的问题问题描述: x轴数据太多,且坐标轴标签文字较多,想要把数据全部展示出来会造成文字重叠。解决思路: echarts提供了dataZoom组件用于区域缩放,但下载的截图只能体现当前展示的内容,可以做成默认正常展示前几个,收缩到一定程度的时候改变axisLabel的角度,斜着展示。解决步骤:控制展示文字长度,设置axisLabel,如果字符串长度大于6,则中间的内容用‘…’代替option.xAxis.axisLabel = { show: tru原创 2021-04-15 14:13:17 · 17672 阅读 · 0 评论 -
封装一个可手动取消的axios请求
封装一个可手动取消的请求需求描述: 文件上传过程中,不断请求一个接口,获取实时的导入结果,并以进度条的形式展示在页面上。思路: 设置计时器,不断向后台发起请求,一旦返回的请求结果为100%就清除计时器,这时会有大量正在pending中的请求,会占用大量的资源,需要手动取消请求。封装请求: 以get请求为例,与普通请求相比会多设置一个cancelTaken。export const getRequestCanCancel = (url, params, that) => { let a原创 2021-03-05 15:46:20 · 383 阅读 · 2 评论 -
iview表格表头上添加icon图标
iview表格表头上添加icon图标需求描述: 如图,在表格表头处添加icon图标,并且鼠标悬浮时有提示语。解决方案: 使用iview表格中自带的 renderHeader 函数,其用法和 render 类似,代码:<template> <div> <Table :columns="tableColumn" :data="tableData" class="honorTable"> <template原创 2021-03-02 13:58:04 · 2160 阅读 · 0 评论 -
elementUI表格带有icon图标的内容超出隐藏
elementUI表格带有icon图标的内容超出隐藏问题描述: elementUI表格中提供了 show-overflow-tooltip 属性隐藏表格中过长的内容,并显示tooltip,但如果内容后面有icon图标或其他操作按钮的时候,设置这个属性会连带着这些操作按钮一起隐藏,无法满足我们的需求。不做处理会自动换行:设置 show-overflow-tooltip 属性图标会被隐藏:解决思路: 给文字内容标签设置最大宽度超出隐藏,超出时显示tooltip文字提示<el-table-co原创 2020-10-13 14:43:50 · 1090 阅读 · 1 评论 -
Promise语法实现页面元素延时渲染问题
Promise语法用例解析需求: vue项目中将页面中某一元素固定定位在home页面的右上角,用户名标签的后面。问题思路: 用户名是通过接口异步获取的,需要获取到用户名对应的元素的宽度之后,再调整该固定定位元素的右偏移量right。解决方法一:直接在home页面获取用户名的接口请求成功之后,查找到该元素并进行赋值操作。但这个接口只调用一次,切换到其他页面,再切换到有该元素的页面上的时候,该元素相当于销毁后再创建的,之前动态添加的css属性将不再起作用。解决方法二:用 setTimeOut 做延时原创 2020-09-18 17:02:11 · 881 阅读 · 0 评论