- 博客(53)
- 收藏
- 关注
RSS订阅
原创 Echart+vue制作立体柱状图
Echart+Vue制作立体柱状图先来看一下制作完成后的效果：废话不多说，直接上代码：HTML代码： <div class="lineOne"> <span class="spanTitle">使用时长排行</span> <div id="timeRange" style="width:100%;height:400px"> </div> </d
2020-05-29 09:58:21
2404
1
原创 uniapp滚动加载
uniapp实现滚动加载，先获取10条数据，滚动到底时，再获取10条数据，以此类推，直至没有数据为止。4. 当滚动到底部时，调用refreshData。2. 在data中定义。
2024-06-18 17:00:01
401
原创 前端面试题总结（二）
Vue双向绑定原理是通过数据劫持+发布订阅模式相结合的方式来实现的，就是数据层发生变化时，可同步更新视图层，当视图层发生变化时，同步更新数据层。computed不支持异步。css计算属性：width，height，margin，padding，border，font-size，line-height，top，left，right，bottom，transform，transition，calc()null，undefined，string，number，boolean，ES6还多了一种symbol。
2023-07-17 17:06:13
258
转载 JS数组对象排序
JS数组对象通过 sort 排序var person = [{name:"Rom",age:12},{name:"Bob",age:22},{name:"Ma",age:5},{name:"Tony",age:25}] person.sort((a,b)=>{ return a.age-b.age})//升序 person.sort((a,b)=>{ return b.age-a.age})//降序
2022-03-30 11:00:22
188
转载 ant design vue表格合并
ant design vue表格合并先看一下官方文档给出的合并单元格的方法，要合并Home phone这一列，columns中的代码如下：{ title: 'Home phone', colSpan: 2, dataIndex: 'tel', customRender: (value, row, index) => { const obj = { children: value,
2022-01-28 10:46:01
995
2
原创 记住密码 AES加密解密
记住密码AES加密存储，解密获取1、引入文件import CryptoJS from 'crypto-js/crypto-js'; // 引入crypto-js/crypto-js 加密算法类库import { setStore,getStore } from '@/util/store';2、定义默认值// 默认的 KEY 与 iv 如果没有给const KEY = CryptoJS.enc.Utf8.parse('QwdsFGxcV18529Uq'); // 十六位十六进制数作为密钥c
2021-12-30 16:43:02
268
原创 avue 关闭当前页返回上一页
avue关闭当前页面，返回上一页this.$router.$avueRouter.closeTag()window.histroy.back()
2021-12-30 16:13:47
764
原创 用Promise.all做多个表单校验
用Promise.all做多个表单校验有时候，我们需要对多个表单进行同时校验，只有都校验通过才可以进行下一步。比较简单的方法就是，if(){}else{}嵌套使用，if A表单校验成功，再校验B表单。其实js提供了promise方法来帮助我们实现这一功能，代码如下：const p1 = new Promise((resolve, reject) => { this.$refs.projectInfo.validate(valid => { if (vali
2021-11-16 17:39:51
1708
原创 使用setStore和getStore缓存页面查询条件和当前页
缓存查询条件和当前页实际应用中，很多时候当我们刷新页面时，本来的查询条件和页码都会置空和置零，这会带来很多不便。例如：当我们需要比较A页面和B页面的某个数据时，会需要在两个页面中来回切换，如果一直刷新页面就非常不方便。解决方案如下：导入setStore和getStoreimport { setStore, getStore } from '@/util/store';缓存数据//缓存数据cachePage() { const tmp = getStore({ name:
2021-11-16 16:39:30
2773
原创 关于vue 页面带参跳转
关于vue页面带参跳转方法一：this.$router.push({ path:`/detail/${id}` })//取参：this.$route.params.id这种方式参数是将id跟在url后，刷新页面后参数不会丢失方法二：this.$router.push({ name:'detail', params:{ id:id }}//取参：this.$route.params.id这种传参方式，必须用name进行跳转，url
2021-10-29 16:14:40
236
1
转载 解决JS浮点数运算结果不精确的Bug
最近在做项目的时候，涉及到产品价格的计算，经常会出现JS浮点数精度问题，这个问题，对于财务管理系统的开发者来说，是个非常严重的问题（涉及到钱相关的问题都是严重的问题），这里把相关的原因和问题的解决方案整理一下，也希望给各位提供一些参考。一. 常见例子 // 加法 0.1 + 0.2 = 0.30000000000000004 0.1 + 0.7 = 0.7999999999999999 0.2 + 0.4 = 0.6000000000000001 // 减法 0.3
2021-09-07 17:50:26
463
原创 el-table插入表单并校验
el-table插入表单先看一下效果图，点保存时，校验这一行。代码如下：<el-form ref="form" :rules="rules" :model="form"> <el-table ref="table" border :data="form.tableData"> <el-table-column align="center" width="160px" prop="materialRatio"> <templat
2021-09-06 10:42:22
444
原创 avue 表单远程搜索、模糊查询
关于avue的模糊下拉直接上代码：computed:{ option(){ return{ emptyBtn: false, submitBtn: false, menuSpan: 8, menuBtn: false, column: [{ label: "经销商名称", labelWidth: 90, prop: "deal
2021-08-23 14:32:09
2617
转载 vue通信、传值的多种方式
Vue通信、传值的多种方式，详解一、通过路由带参数进行传值①两个组件 A和B,A组件通过query把orderId传递给B组件（触发事件可以是点击事件、钩子函数等）this.$router.push({ path: '/conponentsB', query: { orderId: 123 } }) // 跳转到B②在B组件中获取A组件传递过来的参数this.$route.query.orderId二、通过设置 Session Storage缓存的形式进行传递①两个组件A和B，在A组件中设
2021-08-23 14:20:50
268
原创 javascript整理数组
js整理数组为 2-4,15,20-23例如，原数组为 [2,3,4,15,20,21,22,23]，我们需要通过js整理成2-4,15,20-23的格式。话不多说，直接上代码：changeArray(){ var list = [2,3,4,15,20,21,22,23] var r = list.splice(0) var nr = wr = [] for(var i=1;i<r.length;i++){ nr.push(r[i]-r[i-1])
2021-06-09 11:32:36
99
原创 input实现不可复制、不可剪切、不可粘贴、不可右击
input输入框不可复制剪切粘贴右击<input name="pwd" type="password" id="pwd" onpaste="return false" oncontextmenu="return false" oncopy="return false" oncut="return false" />其中：onpaste: 粘贴时触发的事件；oncontextmenu: 右击时触发的事件；oncopy: 复制拷贝时触发的事件；oncut: 剪切时触发的事件。这些属
2021-06-09 11:17:16
757
原创 echarts饼状图tooltip显示更多信息
echarts饼状图tooltip显示更多信息先看效果图：如图，tooltip除了显示总数外，还显示了已使用，未使用和报修中的数据。首先，我们需要把数据整理成如下格式：然后，在调用方法中做如下处理，就OK啦：...
2021-01-14 13:29:29
2482
3
原创 Vue实现文字向上滚动
Vue 实现文字向上滚动先看下效果图（不会插动态的，静态的将就看吧）：下面直接上代码：HTML部分(当数组长度小于6时，正常显示，长度大于等于6时，滚动显示)：<div :class="arr.length >= 6?'inner-container':'flowText'" > <p class="text" v-for="(text,index) in arr" :key="index">{{text}}</p></div>CS
2021-01-14 13:20:54
1366
原创 vue-cli2和vue-cli3定义全局变量
vue-cli2和vue-cli3定义全局变量vue-cli2定义全局变量定义一个全局变量模块 try.vue文件：const token ='987654321'export default { //导出全局变量 token}在main.js文件中，将try.vue挂载到Vue.prototypeimport try from './components/try'Vue.prototype.try = try就可以在其他页面直接通过this.try访问全局变量
2021-01-14 11:20:00
620
原创 JS正则表达式集合整理
JS各种正则表达式整理合集验证手机号验证电话号码验证IP地址验证端口号验证邮箱验证是否含特殊字符验证是否是数字验证是否包含中文验证是否是纯英文验证QQ号码验证身份证URL地址防SQL注入文本框防SQL注入在日常编码中，我们经常需要用正则表达式来判断form表单中一些输入框的对错，为了方便使用，我把常用的各类表达式做了一个整理，如下：验证手机号手机号一般都是11位数字，并且以1开头，代码如下：var reg = /^1[3|5|7|8][0-9]\d{4,8}$/if(reg.test(value)
2020-09-24 10:52:32
137
原创 js整理合并数组
JS整理合并数组数组list=[2,3,4,15,20,21,22,23]，整理后的结果是[2-4,15,20-23]，代码如下：changeArray(){ var list = [2,3,4,15,20,21,22,23] var array = list.splice(0) var alist = blist= [] for(var i=1; i<array.length; i++){ alist.push(array[i] - array[i-1])
2020-08-07 11:31:03
77
原创 JS判断时间先后顺序
JS判断两个时间先后顺序，如08:40:00和09:20:30话不多说，直接上代码checkEndTime(start,end){ var t1 = new Date() let parts = start.split(":") t1.setHours(parts[0], parts[1], parts[2], 0) var t2 = new Date() t2.setHours(parts[0], parts[1], parts[2], 0) if(t1
2020-08-07 11:16:21
931
原创 elementUI 表格的个性化处理 合集
elementUI 表格的个性化处理 合集1.表头样式效果图如上<el-table :data="tableTreeDdata" size="medium" v-loading="loading" element-loading-text="$t('action.loading')" :default-sort="{prop: 'date', order: 'descending'}" style=
2020-08-07 11:06:37
2382
原创 elementUI el-tree动态菜单加静态菜单
elementUI el-tree动态菜单加静态菜单 懒加载先来看一下要实现的效果图：目前我们有两个接口，一个获取动态菜单，一个获取静态菜单，利用懒加载实现效果图，步骤如下：首先，我们需要先拿到动态菜单；然后，遍历动态菜单，拿到最底层的菜单；然后，通过最底层菜单的id获取静态菜单；最后，赋值进去。下面直接上代码：HTML部分： <el-tree :data="treeData" node-key="id" ref="tree"
2020-05-29 11:00:35
764
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人