- 博客(30)
- 收藏
- 关注
RSS订阅原创 antdVue + Vue3实现table + 节点的甘特图
实现思路：获取表格中所有开始时间与结束时间，筛选出最小与最大的时间节点进行计算得出总天数用来遍历生成多少个dom节点，然后根据dayjs().isBetween判断当前节点是否在所选范围之内，如果在就展示进度条，如果大于1天就把表格中的名称信息展示在进度条后一天。
2024-07-29 14:36:52
580
原创 Echarts图例遇到的问题
例如：以上就是今天要讲的内容，本文仅仅简单介绍了pandas的使用，而pandas提供了大量能使我们快速便捷地处理数据的函数和方法。
2023-06-27 14:43:27
183
原创 大屏自适应遇见的bug
第一种解决方案是将body的上下左右外边距都设置为0。（注意如果有body有任何一个方向的外边距不为0，都会可能导致横向和纵向都出现滚动条，这是因为横向的滚动条的出现会使视口的高度变高，纵向滚动条的出现使得视口宽度变宽。）第二种解决方案是给绿色盒子设置max-width:100%使得横向滚动条消失。第三种解决方案是给body元素设置溢出隐藏（overflow:hidden)第四种解决方案是给html元素设置溢出隐藏overflow:hidden)2、设置宽width与最大宽度max-width100
2023-06-27 13:24:40
536
原创 关于vuex及五大核心概念(用法)
核心用法：1. mapState(读取this.$store.state中的数据)vuex： state: { sum: 0, userInfo: { name: "小三", sex: "女", age: 18, like: "找男人" } },页面中使用：import { mapState } from "vuex";/* 此时可直接使用this.sum读取vuex中的数据 */computed: { ...m
2022-03-07 15:55:51
133
原创 关于element-ui的日期选择器向前选七天工作日(非节假日与周六周末),有几天节假日就继续往前推几天
前言：首先我看到这个需求的时候是懵逼的，这是提出的啥J8需求？ 但是想到用户就是上帝，我只是21世纪的高级农民工，马上平复心情回到现实开始动手。逻辑步骤：1，选出前七天的时间并且过滤掉节假日与周六末，并记录过滤掉了几天，然后继续往前补几天。2，比如昨天跟前天都是节假日，往前补天的时候会出现补到非节假日的一天然后两个日期重复，所以需要拿到日期 然后再内部过滤一下重复，如果重复继续往前补。先放实现的功能图：我当天是2022年2月9号，所以可选值为2月8号，2月7号，1月28，1月27，1月26，1月2
2022-02-09 14:16:28
2056
原创 Antd Vue table合并列表格
前言：本来想着在网上随便搜个demo借鉴一下，但是找了好几个首页置顶的 发现效果都有点差强人意（好多都是因为相同的数据是相邻的所以才会合并 如果不相邻的话排版直接就废了） 先上效果！在网上找的如果这种中间如果穿插有不同的value的话 写的逻辑不生效了，然后开始上代码：html:<template> <a-table :columns="columns" :data-source="data" bordered > </a-table
2022-01-17 12:59:53
936
2
原创 关于element tree树默认展开几级
前言：今天不加班了，写点代码吧…突然心血来潮想把遇见的这个小功能点加到博客里这里主要用到了 node-key=“id” 跟 :default-expanded-keys=“defaultShowNodes” 这两个属性第一个是根据绑定的字段来保证每一项数据的唯一性 第二个是默认展开的数组id我这里是自己写了个递归来实现具体代码废话不多说 开始展示代码 <el-tree ref="tree" :data="studentTree" :highligh
2021-12-18 13:38:39
3870
转载 Vue--表格导出excel（导出table表格所有数据）
首先声明 非原创 原创地址一、 第一步先安装3个依赖包： npm install -S file-saver npm install -S xlsx npm install -D script-loader二、在项目中新建一个文件夹（名字自取，这里命名excel），然后在文件夹中放入Blob.js 和 export2Excel.js 两个文件（我把地址贴在这，可以直接下载解压）链接地址：https://pan.baidu.com/s/1itpx7GqPhp44CWdK-NT5qw提取码：kz
2021-07-14 14:34:44
1141
1
转载 JavaScript中的双向数据绑定
双向数据绑定的原理是：可以将对象的属性绑定到UI，具体的说，我们有一个对象，该对象有一个name属性，当我们给这个对象name属性赋新值的时候，新值在UI上也会得到更新。同样的道理，当我们有一个输入框或者textarea的时候，我们输入一个新值的时候，也会在该对象的name属性得到更新。实现数据绑定的做法有如下几种：发布者-订阅模式（http://www.cnblogs.com/tugenhua0707/p/7471381.html）脏值检查(angular.js)数据劫持(vue.js)脏值
2021-07-08 11:43:58
303
转载 本地h5页面如何在手机上预览 ---完美实现。
安装node环境。在当前所在项目文件夹下输入命令： npm install anywhere -g运行项目： anywhere此时会弹出一个地址，手机上访问这个地址就可以了。亲测有效。原文地址
2021-06-17 14:59:38
1057
1
转载 H5实现提示框
引入链接 <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script><button onclick="submit()">1111111</button> function submit() { swal("兑换码不能为空", { buttons: false, timer: 2000, }); }...
2021-06-17 14:56:20
1473
转载 H5移动端震动功能
判断兼容浏览器对振动API的支持情况，一个好的习惯就是在使用之前要检查一下当前你的应用环境、浏览器是否支持振动API。下面就是检测的方法：setTimeout(()=>{ navigator.vibrate = navigator.vibrate || navigator.webkitVibrate || navigator.mozVibrate || navigator.msVibrate; if(navigator.vibrate) { console.log(
2021-06-01 17:16:01
1065
原创 element下拉列表动态显示隐藏表格列数据
先上效果图上代码这里用的是element的下拉菜单 + 多选 <el-checkbox-group v-model="checkList" style="float: right;margin-right:20px" > <el-dropdown :hide-on-click="false"> <el-button type="primary" plain size="
2021-04-20 09:07:19
1539
原创 Element Cascader 级联选择器没有子选项选择不了父选项
<el-cascader :options="favPostIdOptions" v-model="formData.jobChannelId" > <template slot-scope="{ data }"> <span>{{ data.label }}</span> </te...
2021-04-09 14:12:35
1845
转载 vue实现F5刷新整个页面 无空白 无间隔时间
vue实现F5刷新整个页面 无空白 无间隔时间通过this.$router.go(0)刷新页面，和F5一样，会有空白页时间，体验不好。通过provide/inject即可改变这种效果。首先在App.vue里面：<template> <div id="app"> <router-view v-if="isRouterAlive" /> </div></template><script>export de
2021-04-06 08:47:28
1839
原创 elementui 单独修改一个label的样式
使用/deep/穿透就可以实现自己想要的label样式啦 <el-form> <el-form-item label="活动区域" class="colorItem"> <el-input v-model=""></el-input> </el-form-item> </el-form> <style scoped> .colorItem /deep/ .el-form-item_
2021-04-01 11:42:38
1084
原创 vue中的element文件上传
element 的的引入不用说了吧axios的封装跟使用本人博客有详细介绍https://blog.csdn.net/qq_45970524/article/details/114264507直接撸代码<template> <div> <el-upload class="upload-demo" ref="upload" action="#" :limit="1" :on-preview="hand
2021-03-29 16:24:54
166
1
原创 vue项目使用阿里矢量图标库
1.打开阿里图标库选择想要的图标然后添加入库2.把选择好的图标添加到我的项目中然后在我的项目中查看ps:我用的是unicode的方法，三种方法看个人习惯3.点击下载到本地，下载之后是一个压缩文件，然后解压打包之后把iconfont.css添加至vue-cli项目的静态文件夹中。ps:我是在assets中创建了一个css文件夹，我把这个css文件放在了这里边4.在main.js中全局引入这个css文件 import '@/assets/css/iconfont.css'5.在css文件中
2021-03-22 16:21:23
339
原创 关于vue项目表单验证身份证号的正则表达式
我是直接在vue项目的from表单中的自定义验证中定义的，直接上代码撸。rules：{ idNumber: [ { required: true, message: "请输入身份证号", trigger: "blur", }, { //自定义身份证号验证 validator: (rule, value, callback) =
2021-03-17 17:15:40
3497
原创 在vue-cli中使用vuex中的mapState
废话不说直接上代码1.在vueX文件中写一个每次加等的方法import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({ state: { sum: 0, }, mutations: { cliadd(state, data) { state.sum += data } },
2021-03-16 10:54:15
190
原创 vue中axios的封装使用
vue axios的封装使用vue安装axios npm install axios -S 或者 npm i axios -S在main.js进行全局引入 import axios from 'axios' Vue.prototype.$axios = axios //将axios绑定到vue的原型上在api文件夹下创建http文件 // 导入axios（已封装） // ps:如果没有封装，正常引入axios即可 import axios
2021-03-01 15:53:59
6124
12
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人