- 博客(33)
- 收藏
- 关注
原创 使用element-ui项目打包后icon图标不显示
在使用vue-cli搭建项目的时候,用了element-ui组件库的图标的,使用npm run build打包项目放到服务的时候,图标显示是框;需要修改两个配置:1.首先在config文件夹下的index.js中的build 下的 assetsPublicPath,记得加.2.build文件夹下的utils.js文件中加一行npm run build 重新打个包就好了!...
2022-02-23 16:43:11
2806
2
原创 微信小程序异步获取缓存的三种方式
微信小程序的本地缓存跟H5的localStorage非常类似,是前端的数据库,以下用三种异步函数来实现本地缓存值的获取。es5标准:通过回调函数获取//设置缓存值wx.setStorageSync('token', '123')//异步获取缓存const token= wx.getStorage({ key: 'token', success(data){ console.log(data) }})es6标准:通过promiss//设置缓存值wx.set
2021-09-22 11:22:19
2003
原创 微信小程序引入iconfont彩色图标
小程序引用iconfont前两种不支持彩色,必须使用symbol,使用方法如下:引用方法名 支持多色 兼容性 unicode × 好 font-class × 良好 symbol √ 差 1.小程序项目根目录输入命令:npm install mini-program-iconfont-cli --save-dev2.根目录生成iconfont.json文件:npx iconfont-init3.打开json文件...
2021-06-22 09:44:47
1066
1
原创 微信小程序UI组件库合集
UI组件库合集,大家有遇到好的组件库,欢迎留言评论然后加入到文档里。第一款:官方WeUI组件库,地址https://developers.weixin.qq.com/miniprogram/dev/extended/weui/预览码:第二款:ColorUI:地址https://github.com/weilanwl/ColorUI预览码:第三款:vantUI(又名:ZanUI):地址https://youzan.github.io/vant-we...
2021-06-10 09:49:59
415
原创 微信小程序读取变量调用同名函数
比如我配置的数据如下,bindFunc字段存的就是需要调用的函数 const cItem= { icon: 'icon-toubao', text: '在线投保', path: '/', color: '#FFB40C', fontSize: '19pt', bindFunc: 'showLoginTip' } cItem通过标签data-funname.
2021-03-17 10:50:36
621
转载 Vue所有基础语法细节整理复习
https://blog.csdn.net/weixin_43342105/article/details/106153672
2021-03-16 10:02:17
156
原创 微信小程序自定义tabbar组件
由于项目需求,必须自己写组件:第一步,在App.json中配置tabBar,自定也组件也必须配置,"custom":true,list里配置所有的tabbar页面。 "tabBar": { "custom": true, "color": "red", "selectedColor": "#3b81d7", "backgroundColor": "#000000", "list": [{ "pagePath": "pages/Role/Ins.
2021-03-12 18:25:39
558
原创 前端js多个小数相加出现无限循环小数的解决办法
add: function () { const arr = [0.1, 0.2] const fieldArr = [] for (var i = 0; i < arr.length; i++) { var m, field; try { field = arr[i].toString().split('.')[1].length; } catch (e) { field = 0; } ...
2021-03-12 09:22:02
3816
3
转载 vue 中配置vuex以及vuex的使用方法
目录一、安装vuex二、将vuex配置到vue中1. 在src目录下创建store文件夹2.index.js对vuex进行配置导出3.在src文件夹下的入口js文件main.js中引入输出的store三、vuex的使用方法1.如何在页面是和你说过调用store里面的方法2.如何在页面获取store里面的参数一、安装vuexnpm install vuex --save二、将vuex配置到vue中1. 在src目录下创建store文件夹在store文件夹下面创建module文件夹用于存放不同功能的
2021-03-10 18:12:09
516
转载 微信小程序自定义单页面、全局导航栏
在 app.json window 增加"navigationStyle":"custom",顶部导航栏就会消失,只保留右上角胶囊状的按钮,如何修改胶囊的颜色呢;胶囊体目前只支持黑色和白色两种颜色 在 app.josn window 加上"navigationBarTextStyle":"white/black"。还要考虑加返回按钮和返回首页的按钮,适配不同的机型。先说下两种配置方法:1、全局配置navigationStyle 调试基础库>=1.9.0 微信客户端>..
2021-03-10 14:45:29
1276
原创 微信小程序component组件中回调函数的this指向
在组件component中调用接口,但是接口的this指向确undefined,解决方法如下:在组件中调用接口,有2种解决方法,一种是通过bind改变this指向,一种是通过箭头函数改变this指向;通过bind来改变this指向,bind返回的是一个函数,这个函数可以作为回调函数 call.request('assessResult/calculateScore', this.data.checkExpert, "POST", '', this.success_getScore.bind(t
2021-03-10 12:50:31
1159
转载 CSS Grid 网格布局教程
一、概述网格布局(Grid)是最强大的 CSS 布局方案。它将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局。以前,只能通过复杂的 CSS 框架达到的效果,现在浏览器内置了。上图这样的布局,就是 Grid 布局的拿手好戏。Grid 布局与Flex 布局有一定的相似性,都可以指定容器内部多个项目的位置。但是,它们也存在重大区别。Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列",产生单元格,然后.
2021-02-04 14:55:40
191
转载 深入了解 JavaScript 中的 for 循环
深入了解 JavaScript 中的 for 循环在ES5中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循环,是: for-of 下面我们就来看看这 4 种 for 循环。简单 for 循环下面先来看看大家最常见的一种写法:const arr = [1, 2, 3];for(let i = 0; i < arr.length..
2020-12-23 16:24:15
336
1
转载 微信小程序强制更新
如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本。用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新。官方给的示例代码:const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { // 请求完新版本信息的回调 console.log(res.hasUpdate.
2020-10-22 16:20:42
2652
原创 App上线应用商城需要准备哪些材料
上线应用商城华为应用商城 360手机助手 总结前言以下内容均为本人实际申请过记录的,全部干货。提示:以下是本篇文章正文内容,下面案例可供参考一、华为应用商城申请网址(华为开发者联盟):https://developer.huawei.com/consumer/cn/doc/help/100102企业实名认证建议采用对公账号,只要提供对公账号,很快就会收到一笔数目很小的钱,把金额数输入验证,实名认证就通过了。上线App需要的材料:企业邮箱 手机号 座机号.
2020-09-30 16:56:46
1334
原创 element-ui使用总结
在项目中用到了element-ui ,使用时遇到部分问题,总结如下:1.日期限制、自定义表单验证实现限制日期前后以下为element-UI表单组件的一个表单项,prop是表单域 model 字段,在使用 validate、resetFields 方法的情况下,该属性是必填的,值应该是Form 组件的model中的字段,详情可以查看官方文档;<el-form-item ...
2020-04-15 16:33:53
474
1
原创 vue跨域处理
1.为什么会跨域:因为浏览器同源策略的限制,不是同源的脚本不能操作其他源下面的对象。同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。简单的来说:协议、IP、端口三者都相同,则为同源正在上传…重新上传取消...
2020-04-07 15:30:32
301
原创 自定义小程序echart插件图表点击事件
由于微信小程序 canvas组件没有提供tap事件,所以导致echart的插件也无法相应tap事件,所以这里需要我们自定义tap事件打开插件目录下 ec-canvas.js (tap的原理就是,touchstart----untouchmove----->touchend)添加如下代码:data: { startPoint:false //添加事件标志位},...to...
2019-11-06 09:01:24
4430
2
原创 微信小程序使用汇总
1.微信小程序UI框架: 目前还没有找到很完美的UI框架,所以基本上还是采用自己手写,基础的布局可以借用weui;2.获取登录用户微信头像<open-data type="userAvatarUrl"></open-data>3.页面跳转(两种方式) 第一种:通过<navigator url="" open-type="navigate"...
2019-08-21 10:50:28
437
原创 父容器高度根据子容器变化
在其他博客上看到了一片关于父容器高度自动变化的博文,发现自己也不是全都知道,学习后分享给大家;原来一直设置父元素高度为auto,但发现效果并不对,一直以来都没有思考这个问题;想要设置父元素高度随着子元素自动变化,有以下几种方式可以参考:1.清除浮动<style type="text/css"> .child{ width: 100px; height: 10...
2019-08-21 09:31:29
1382
转载 微信小程序无法发起接口请求
最近在做小程序开发,踩到了一个坑,在这里记录一下。用小程序开发者工具时,在开发阶段,可能有些接口域名还没上线或者还没配置成小程序的白名单或者HTTPS证书等问题,但为了能正常开发,开发者工具有个设置可以先跳过域名、https等的校验。但是,当你开发完的时候,需要在真机预览呢?真机可以跳过这些校验吗?答案是可以的。微信真机预览小程序时,点击右上角“三点”按钮可以设置debug模式,设...
2019-06-03 10:44:30
7360
原创 css移动动画效果(伪类+transition+ transform+ animation)
一、常用概念区分:1、transform(变形)——组合属性,可以只设置其中一个/多个属性值,空格隔开。属性定义元素的形状/位置变化,:可以定义五个子属性:移动translate缩放scale旋转rotate扭曲skew矩阵变形matrix元素2、translate(移动)——transform的一个属性值,定义元素的移动效果translate(x,y)两坐标同时移动,可以使...
2019-04-15 09:39:30
18823
转载 HTML5 JQuery 实现搜索匹配功能
保存以便后期借鉴:<!doctype html><html><head><meta charset="utf-8"><title>HTML5 JS实现搜索匹配功能-jq22.com</title><script src="https://libs.baidu.com/jquery/1.11.3/jqu...
2019-04-12 16:46:05
1349
原创 前端实现拖动滑块完成验证
index.html <div id="drag"> <div class="drag_bg"></div> <div class="drag_text slidetounlock" onselectstart="return false;" unselectable="on"> 请按住滑块,拖动到最右边 &l...
2019-04-11 17:54:12
4696
原创 如何操作iframe父页面中的元素、方法、变量
近期遇到需要操作iframe外的元素,总结如下:1. 在iframe中查找父页面元素的方法:jQuery的方法:$("#id",window.parent.document) $(window.parent.document).find('.header');原生的方法: window.parent.document.getEle...
2019-04-11 17:43:13
476
原创 前端js判断访问站点设备是手机还是PC
在开发中遇到此类问题,以下为本人在开发中查找到的实现方法。 //判断登录设备 var userAgentInfo = navigator.userAgent; var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
2019-02-23 14:43:06
1293
原创 vue中$emit与$on
在做项目中经常会用到$emit与$on,自己通过查找学习后完成了项目,现将学习总结如下:1.定义全局的:在app.vue中:window.Event = new Vue(); 相当于又new了一个vue实例,Event中含有vue的全部方法;Event.$on('transitionName', function (msg) {that.transitionName = m...
2018-12-17 08:58:21
680
原创 layui使用总结
1.富文本编辑器(在官方文档上的导航栏找不到,但是确实是存在,哈哈)https://www.layui.com/doc/modules/layedit.html2.layui的日期的限制(写法很多,以下为在整个项目中用的较多的一个方法)开始日期选中后,结束日期必须在开始日期之后 layui.use('laydate', function () { var la...
2018-11-06 10:22:50
1379
原创 web页面自适应屏幕的疑问列举
在做项目中,一般不会在大屏幕上进行测试,偶尔的一次机会,我在一个大屏的苹果台式电脑上查看我做的页面,发现了一些适应不好的地方,因此存在一些疑虑;1.现在的前端UI框架已经基本上可以做到在普通电脑上的自适应或响应式,我的疑问举例说明:<div class="layui-container"> <div class="layui-row"> ...
2018-11-06 09:29:40
320
原创 双飞翼布局
大四找实习工作的时候面试被问到这个问题,当时是第一次听说这个,不过在面试官的引导下也大致实现了。刚好想起来了,就实现以下。<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>双飞翼</title>
2018-10-09 15:47:01
122
转载 使用 vue-cli + element-ui 快速搭建项目
一、前言vue2.0的到来,凭借这其简单易学、完善的API中文文档、丰富的生态系统,成为国内目前十分受欢迎的前端MVVM框架,element-ui是基于 vue2.0的 ui框架,由饿了么团队开发维护的,目前是vue的ui库中最受欢迎的一个框架element-ui官网vue专题网站在vue专题中可以看到各个ui框架的受欢迎程度二、代码操作使用vue-cli + elem...
2018-10-09 15:21:33
1511
原创 alt和Title的区别在哪
alt属性alt属性是为了给那些不能看到文档中图像的浏览者提供文字说明。所以alt属性的本意是用于替换图像,而不是为图像提供额外的说明。但是,在IE浏览器中,alt属性会变成文字有提示,这本身是一种误导。所以,如果你使用Firefox或者Chrome。alt属性就会不管用。Title属性title属性是对图片的说明和额外补充,如果需要在鼠标经过图片时出现文字提示应该用属性title。t
2017-09-07 15:35:36
478
转载 自适应和响应式的区别
先给大家体验一下响应式和自适应的区别,请放大缩小一下屏幕尝试 自适应的体验http://m.ctrip.com/html5/ 响应式的体验 http://segmentfault.com/ 整理了几篇自适应和响应式的文章,摘抄并修改了一下,请大家欣赏: 起初,网页设计者都会设计固定宽度的页面,最开始的电脑显示器分辨率种类不多,因为当时电脑本来就少,即使有变化也是 800
2017-09-07 15:28:13
349
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人