VUE及相关UI框架 - 随笔分类(第3页) - 羽丫头不乖

摘要：elementUI 日期选择器之禁止年份事件 <script> export default { data() { return { selectYear: null, } }, mounted() { }, methods:{ initStyle() { this.$nextTick(() => 阅读全文

posted @ 2021-05-25 13:46 羽丫头不乖阅读(774) 评论(0) 推荐(0)

elementUI el-date-picker禁止年份点击事件

摘要：elementUI el-date-picker之月份日期组件禁止年份点击事件实现功能： 1、单元格文本变更，以数字月份形式展示，如：01月 2、隐藏头部月份左右切换按钮的展示 3、头部年份切换按钮区间限制，即只能在区间内年份切换 4、头部年份点击事件禁用组件参数： 1、selectDateAl 阅读全文

posted @ 2021-05-25 13:21 羽丫头不乖阅读(3941) 评论(1) 推荐(1)

elementUI实现日期框之月份选择器选中项高亮（一）

摘要：elementUI实现月份选择器选中项高亮实现点： 1、只允许选择当前年的月份，隐藏了年份左右切换按钮 2、当前选中月份标记背景色 3、确认选定的值时触发事件dateChange 4、DatePicker 下拉框样式调整 5、DatePicker 下拉框之单元格文本中英文切换，默认展示的中文（使用阅读全文

posted @ 2021-04-30 14:21 羽丫头不乖阅读(1917) 评论(0) 推荐(0)

vue 全局插件封装--提示toast

摘要：文章以提示框Toast为例实现Vue全局插件封装，并在全局中使用。 main.js中引入 import ToastInfo from '@/plugin/toastInfo.js'; Vue.use(ToastInfo); 在单页面的使用 methods:{ open2() { this.$toas 阅读全文

posted @ 2021-04-15 09:54 羽丫头不乖阅读(350) 评论(0) 推荐(0)

ElementUI之el-scrollbar+el-select组合

摘要：这篇文章主要是使用了ElementUI的隐藏滚动组件和select选择器，并处理在使用过程中遇到的问题。 1、自定义select样式 2、ScrollBar+select组合 3、当select处于下拉状态时，滚动文本已经到达底部还会继续滚动 4、设置滚动区域的高度，也可设置max-height / 阅读全文

posted @ 2021-04-12 10:03 羽丫头不乖阅读(1307) 评论(0) 推荐(0)

vue 滚动条组件对比

摘要：## vue 滚动条组件对比由于项目中需要使用到滚动区域，且要求滚动区域可以设置最大高度，并要求支持谷歌和IE浏览器。在使用了以下几款滚动条后针对他们的情况记录他们的优缺点 ``` 一、vue-custom-scrollbar 这是一款自定义的滚动插件，基于perfect-scrollbar库。阅读全文

posted @ 2021-04-09 09:14 羽丫头不乖阅读(1269) 评论(0) 推荐(0)

LessJs笔记

摘要：1、变量 @width: 10px; @height: @width + 10px; 2、混合 .bordered { border-top: dotted 1px black; border-bottom: solid 2px black; } #menu{ color: #111; .borde 阅读全文

posted @ 2021-04-01 09:22 羽丫头不乖阅读(59) 评论(0) 推荐(0)

elementUI实现日期框选中项文本高亮

摘要：需求：由于月份选择框会给默认接收的月份文本加入高亮显示，但需求要求将选中的月份标记高亮展示。实现：使用elementUI的日期选择器提供的下拉框样式配置，并改写对应的样式实现。懒得说话，直接上代码： <template> <div> <dataPickSelf size='mini' v-mod 阅读全文

posted @ 2021-03-10 15:04 羽丫头不乖阅读(1006) 评论(0) 推荐(0)

vue+lib-flexible实现大小屏幕，超大屏幕的适配展示。

摘要：Vue +lib-flexible实现大小屏幕，超大屏幕的适配展示。lib-flexible是淘宝项目组开发的插件，属于开源项目，可以在各种项目（vue，react）中引入并使用，利于其将px转成rem的单位转换形式使开发者不用在根据因为分辨率不同书写更多的适配代码。实现步骤: 1、安装lib-f 阅读全文

posted @ 2021-02-23 11:09 羽丫头不乖阅读(4370) 评论(2) 推荐(1)

数据结构转换

摘要：需求：1、将data1的数据格式转换成data_result；2、反转实现： import percentageLine from "@/utils/percentageLine.js" 1、percentageLine(data1); const snapLine = (data) => 阅读全文

posted @ 2021-01-11 14:08 羽丫头不乖阅读(125) 评论(0) 推荐(0)

vue 仿zTree折叠树

摘要：需求： vue实现仿zTree折叠树，此文章仅作为记录文档。实现： <template> <div class="line-tree"> <div v-for="(item, index) in treeData" :key="index" class="single-content" :clas 阅读全文

posted @ 2020-12-29 10:50 羽丫头不乖阅读(341) 评论(0) 推荐(0)

vue 折线柱状图

摘要：需求：折线柱状图实现，显示不同提示，颜色，标记等等。图例：实现： <template> <div class="transaction-barline"> <p class="lenged-title"> <span class="single-lenged" v-for="(item,inde 阅读全文

posted @ 2020-12-29 10:32 羽丫头不乖阅读(278) 评论(0) 推荐(0)

随笔分类 - VUE及相关UI框架