自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(72)
  • 资源 (3)
  • 收藏
  • 关注

原创 深入浅出之ES6(一)

Babel 转码器es6 -> es5Babel 的配置文件是.babelrc,该文件用来设置转码规则和插件,基本格式如下{ "presets": [], "plugins": []}polyfillBabel 默认只转换新的 JavaScript 句法(syntax),而不转换新的 API,比如Iterator、Generator、Set、Map、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)

2021-05-28 14:29:06 290

原创 JS回归基础之DOM 

1. 节点层次DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构。节点分为几种不同的类型,每种类型分别表示文档中不同的信息及(或)标记。每个节点都拥有各自的特点、数据和方法。1.1 Node类型DOM1 级 定义了一个 Node 接口,该接口将由 DOM 中的所有节点类型实现。每个节点都有一个 nodeType 属性,表示节点类型,节点类型由在 Node 类型中定义的下列12 个数值常量来表示,如下所示:Node.ELEMENT_NODE(1)Node.ATTRIB

2021-01-24 15:07:02 208

原创 JS回归基础之BOM 

JS 浏览器对象模型BOM(Browser Object Model )1. window对象客户端 JavaScript 顶层对象。每当 <body> 或 <frameset> 标签出现时,window 对象就会被自动创建1.1 全局作用域var age = 29; window.color = "red"; //在 IE < 9 时抛出错误,在其他所有浏览器中都返回 false delete window.age; //在 IE < 9 时抛出错误,在

2021-01-21 17:23:46 228 1

原创 JS回归基础之面向对象(OOP)

1. 理解对象1.1 属性类型ES5中定义了只有内部才用的特性(attribute),描述了属性(property)的各种特征,不能直接访问,为了表示特性是内部值,放在了两对方括号中,例如[[Enumerable]],ECMAScript中有两种属性:数据属性和访问器属性1.1.1 数据属性[[Configurable]]: 表示能否通过delete删除属性从而重新定义属性,默认true。[[Enumerable]]: 表示能否用过for-in循环返回属性,默认true。[[Writable]

2021-01-04 10:51:29 183 1

原创 JS回归基础之闭包

闭包

2020-12-26 18:31:44 142

原创 JS回归基础之Object的属性和方法

Object的属性和方法Object自带一个prototype的属性,即Object.prototype,Object.prototype本身也是一个对象,也会有一些属性和方法。属性prototype构造函数有一个prototype属性,指向实例对象的原型对象。通过同一个构造函数实例化的多个对象具有相同的原型对象。(经常使用原型对象来实现继承)constructor原型对象有一个constructor属性,指向该原型对象对应的构造函数proto这个东西并不是标准的原型,它是一些浏览器提供的一

2020-12-25 18:23:27 286

原创 JS回归基础之执行上下文/作用域链

最近在研究 JavaScript 基础性的东西,但是看到对于执行上下文的解释我发现有两种,一种是执行上下文包含:variable object(变量对象)、scope(作用域)、this value(this 值),另外一个种是包含:lexical environment(词法环境)、variable environment(变量环境)、this value(this 值)。后面我查阅了不少博客以及 ES3 和 ES5 的规范才了解到,第一种是 ES3 的规范,经典书籍《JavaScript 高级程序设计

2020-12-24 10:09:34 187 2

原创 JS回归基础之this

最近看了很多篇关于this的文章,总结一下吧,这样才能印象深刻。函数的this在调用时绑定的,完全取决于函数的调用位置(也就是函数的调用方法)。为了搞清楚this的指向是什么,必须知道相关函数是如何调用的。全局上下文非严格模式和严格模式中this都是指向顶层对象(浏览器中是window)this === window // true函数上下文普通函数调用模式对象中的函数(方法)调用模式call、apply、bind 调用模式构造函数调用模式原型链中的调用模式箭头函数调用模式DOM

2020-12-20 18:08:45 333 4

原创 VUE 利用keep-alive实现动态缓存

场景:首页(A)——>添加页(B): 不需要缓存,清空表单数据添加页(B)->添加详情页©: 需要缓存使用keep-alive的include结合vuex1.App.vue <keep-alive :include="kpAlive"> <router-view></router-view> </keep-alive> computed: { kpAlive() { retu

2020-12-04 14:12:55 468 2

原创 Vue监听数组和对象的变化

工作中常会遇到一些数据变化了,但是视图未更新的情况,自己写了一些demo简单测试了一下。 iShot2020-07-17下午02.08.22 <template> <div> <h1>yes 可以监听 no 不可以监听</h1> <div>nums:{{nums}}</div> <b

2020-07-17 14:32:35 1618 1

原创 小程序店铺级别购物车,选中非选中逻辑(VUE写法)

效果图:代码:<!-- * @description 购物车-列表 * @author yxf * @date 2020-07-01 * @version 1.0.0 * @lastModifiedBy yxf * @lastModifiedTime 2020-07-01--><template> <div class="wrap"> <view class="list"> <vie

2020-07-02 10:35:00 488 1

原创 总结下工作中常用的数据处理操作

场景:求一个二维数组中某个key值的和,比如合计价格,数量等数据格式:[{x: 1}, {x:2}, {x:3}]--------------------->1+2+3=6方法一: 原生function sum(arr) { var len = arr.length; if(len == 0){ return 0; } else if (len == 1){ return arr[0]; } else { return arr[0] + sum(arr.s

2020-06-18 21:14:58 307 1

原创 vue解决数组变化时,视图未更新的问题

问题:根据id获取要编辑的内容后,有startTime和endTime拼接成日期范围选择器的初始值后,出现无法选中的问题,利用vue-devtools工具发现,值其实已经变化了,只不过视图没有更新。错误写法: this.formParams.actDateRange = [res.data.data.startTime, res.data.data.endTime];解决方法: let arr = [res.data.data.startTime, res.data.data.

2020-06-17 10:26:57 595

原创 element-ui动态增减表单项

先来效果图需求:每加一个场次新增一场活动,并添加验证规则关键代码部分: <el-form-item label="活动场次" prop="roundTimeList"> <el-button type="primary" icon="el-icon-plus" @click="addSession">添加活动场次</el-button> </el-form-item> &

2020-06-17 10:10:09 2419

原创 vue小技巧记录

重置表单数据this.searchForm = JSON.parse(this._searchForm);

2020-06-15 16:01:48 176

原创 element ui 中TimePicker 时间选择器初始值为空时无法选中

如下图所述 <el-time-picker is-range v-model="value1" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" @change="editSession" >&lt

2020-06-12 10:24:20 5169 2

原创 uni-app获取省市区详细位置信息

效果图主要是两个功能一个是可以根据地图搜索定位获取省市区详细地址;另外一种也可以通过picker省市区选择器来实现手动选择问题;最后在实现功能的前提下把代码封装了一下,代码如下/** * 格式化位置 * @param {*} res chooseLocation成功后返回参数 * 格式: { address: "浙江省舟山市定海区昌国路61号" errMsg: "choo...

2020-04-25 20:07:44 10153 9

原创 uni-app使用总结(一)

可以使用本地图片作为背景图(小于40kb)点击查看uni-app背景图片详细说明premission授权问题微信小程序现在需要手动在 app.json中设置premission才可以授权获取位置信息。在pages.json中写是无效的,必须要写在mainfest.json中分包加载(subPackages)点击查看图片的分包加载优化...

2020-04-25 19:46:59 1882 1

原创 基于uni-app,color UI做的小程序索引列表

话不多说,先上效果图数据格式[ { "name": "A", "children": [{ "merchant_name": "阿三1", "merchant_id": 1, "name": "A" }, { "merchant_name": "阿四2", "merchant_id": 2, "name...

2020-04-17 20:18:04 1828 7

原创 AVUE动态生成表头和列

效果图后台返回数据格式:{ "total":5, "per_page":10, "current_page":1, "last_page":1, "data":{ "cols":[ { "prop":"9999999", "label":"商户" ...

2020-03-23 20:16:30 6114 3

原创 正反面沿Y轴垂直自动旋转

效果图代码<template> <div> <div class="boxs"> <div class="box1">正面1</div> <div class="box2">反面1</div> </div> <div class="boxs...

2020-01-07 15:31:32 476 1

原创 AVUE实现前端导出Excel

第一版getData() { this.tableLoading = true; var url = ""; if (this.showDetail) { url = "/admin/subsidy/subsidy_static/cidList"; } else { url = "/admin/subsidy/subsidy_static/cicList"; ...

2020-01-04 14:30:06 6864 12

原创 VUE/AVUE每次打开弹框自动聚焦功能

先来效果图需求: 因为要对接读卡器,每次打开弹框都要点击卡号再把卡放上去,比较麻烦,所以想办法优化了一下avue代码htmljs

2019-12-20 11:27:42 2013

原创 小程序——日期时间选择器(自定义精确到分秒)

效果图:需求:预计进场时间,精确到秒;实现方法:wxml: <picker mode="multiSelector" value="{{dateTime}}" bindchange="changeDateTime" range="{{dateTimeArray}}"> <view class="selectDate tui-picker-detail"&gt...

2019-10-21 15:50:33 3048 1

原创 VUE之全局过滤器——filter

人名币转大写 filters: { //局部过滤器 toChies: function(n) { //形参 var fraction = ["角", "分"]; var digit = ["零", "壹", "贰", "叁", "肆", "伍", "陆", "柒", "捌", "玖"]; var unit = [["元", "万"...

2019-09-21 11:05:04 219

原创 知识储备

页面可以编辑document.body.contentEditable = true 你会发现整个页面都是可编辑的(可以用来装逼);全屏 API(Fullscreen API)Element.requestFullscreen() 方法用于发出异步请求使元素进入全屏模式。调用此 API 并不能保证元素一定能够进入全屏模式。如果元素被允许进入全屏幕模式,document 对象会收到一个 fu...

2019-09-05 09:54:30 198

原创 打开弹框清空数据

// 增加弹框addHandle(){ this.addVisible = true; // 清空表单 this.$refs.addForm.resetFields();},这样子写会报错需要使用nextTick// 增加弹框addHandle(){ this.addVisible = true; this.$nextTick(() => { //...

2019-08-31 10:53:06 817

原创 element ui表单动态验证规则

话不多说,先来效果图:要求是选择延期时,延期天数必填。 <el-form-item label="是否延期" prop="status"> <el-switch v-model="addForm.status" active-color="#13ce66" active-text="是"...

2019-08-30 20:51:11 4240 2

原创 总结常用的正则表达式(未完待续。。。)

手机号: (+86|0086)?s*1[3-8]\d{9}身份证号: \d{15}(\d{2}[0-9Xx])?字母、数字、下划线组成,字母开头,4-16位: /^[a-zA-z]\w{3,15}$/11位数字,以1开头: /^1\d{10}$/电话号码: /^0\d{2,3}-?\d{7,8}$/邮箱: /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/...

2019-08-24 11:29:57 248

原创 vue实现展开与收缩

先来效果图(不要在意样式 - - 丶):collapse.js:const elTransition = '0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out'const Transition = { 'before-enter' (el) { el.st...

2019-08-23 15:50:16 4709 1

原创 总结VSCode设置开发中常用的代码片段(未完待续。。。)

偶然发现VScode的功能,开发者可以把自己常用的代码片段配置一下,提高工作效率。1.vue快速模板:"Print to console": { "prefix": "vue", "body": [ "<template>", " <div class=\"table\">$0</div>", "</template>...

2019-08-23 10:44:31 2537 2

原创 封装localStorage设置失效时间

storage.js:var Storage = { //设置缓存 setItem(params){ let obj = { name:'', value:'', expires:"", startTime:new Date().getTime()//记录何时将值存入缓...

2019-08-23 10:03:50 801 2

原创 微信小程序总结

总结一下最近在小程序中学到的一些东西吧,小程序这东西,如果过一段时间不写,再来写的话,很多东西容易忘,所以自己先总结一下吧,从哪里开始呢。。。1.连续空格\r\t\2.给data中的对象数据赋值this.setData({ ['formFields.name']: e})3.小程序输入框的双向绑定 vegeInput(e){ this.setData({ ...

2019-08-11 13:45:45 139

原创 小程序之上传图片

先来效果图:分割线-------------------------------------------------------------------------------------wxml:<view> <view class='up_img_box'> <!-- 图片预览 --> <view ...

2019-08-11 13:29:32 193

原创 echarts for weixin (canvas原生组件踩坑之路)

最新在做小程序项目中遇到图表的地方,为了图方便省事,选择了自己比较熟悉的echarts,写好之后页面如下:在微信开发者工具上面测试没有任何bug,本以为大功告成了,却在真机测试的时候遇到了一个致命的bug,安卓上面滑动图表时明显感觉不是很流畅,有延时的效果,在ios上面更夸张,直接不能滑动了,然后上网查了之后有以下几种方案:1.去掉ec-canvas.wxml文件中touchStart、to...

2019-08-11 11:09:37 4264

原创 js面试题总结(未完待续。。。)

一.找出重复最多的字符let str = 'asss23sjdssskssa7lsssdkjsssdss'; const arr = str.split("") // 把字符串转换为数组 const str2 = arr.sort().join("") // 首先进行排序,这样结果会把相同的字符放在一起,然后再转换为字符串 let value = ""; let inde...

2019-08-07 10:02:39 166

原创 关于console.table及chrome调试打印变量的问题

vue开发页面,在打印一个返回结果的时候,如何让所有的变量展开。。而不是(…)鼠标移入会提示invoke property getter。今天使用console.table打印东西发现一个奇怪的现象:其中aaa和this.tableData的数据是一样的,不过后者是从后台返回过来的。打印两者结果如下:为什么下面打印的是省略号,如果数据很多的话,还要我一个一个去点开?面向百度吧,最后找到...

2019-08-05 15:23:27 2383

原创 小程序中tab快速切换时的防抖与节流

今天测试在测试小程序时,提了一个bug,真机测试的时候,快速点击tab切换时,会出现下面的swiper-item中的内容快速闪烁,无法停止的情况。想了很久也上网查了大量资料,最后突然想起来好像与防抖和节流有关,于是…函数防抖:英文 debounce 有防反跳的意思,大致就是指防止重复触发。那么,函数防抖,真正的含义是:延迟函数执行。即不管debounce函数触发了多久,只在最后一次触发de...

2019-08-03 14:53:51 1946

原创 vue打包后 背景图不显示

在build 下的 utils.js中找到:if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: 'vue-style-loader', }) } else { return ['vue-style-loader...

2019-07-22 14:40:31 221

原创 vue项目报错总结

一:监听地址不对这种错就是监听地址不对。比如我是这样写的需要修改C:\Windows\System32\drivers\etc下面的hosts文件.可能会出现这种情况解决办法:https://www.playbeta.net/experience/12507.html保存成功后就可以成功跑起来了。...

2019-07-21 10:12:38 219

u-number-box.vue

该组件一般用于商城购物选择物品数量的场景 注意:该输入框只能输入大于或等于0的整数,不支持小数输入; 通过v-model绑定value初始值,此值是双向绑定的,无需在回调中将返回的数值重新赋值给value 通过step属性设置每次点击增加或减少按钮时变化的值,默认为1

2020-07-02

merchant-list.vue

基于uni-app,color UI开发的小程序索引列表,类似通讯录,常用于小程序下拉选择数据比较多的场景,这个时候不适合使用picker选择器,通过前端实现模糊搜索功能可以减轻服务器压力,减少性能消耗。

2020-04-17

Pricecompare.vue

源码文件,源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件源码文件

2020-03-23

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除