- 博客(28)
- 收藏
- 关注
RSS订阅原创 uni-app数据请求封装
1. utils文件夹-> 新建request.jsrequest.js :const baseUrl = 'http://******' //请求接口地址const httpRequest = (url, method, data) => { let meth = method.toUpperCase();//小写改为大写 if (!data) { da...
2020-03-24 17:51:38
3080
原创 vue H5与（Android、iOS）原生APP交互
一：JS调用APP1、封装公共方法：/** *js调用APP * @params {*} Obj 传给app参数 */export function JSToNativeAPP(params) { let isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.i...
2019-12-23 15:03:26
2660
原创 Vue渲染富文本图片点击预览
1.渲染富文本：使用Vue提供的 v-html 进行富文本内容渲染<div v-html="content" @click="imageChgange($event)"></div>2.获取点击元素，点击图片预览绑定点击事件，传入 $event 参数 //ImagePreview Vant组件库图片预览组件 ima...
2019-10-19 16:13:45
3555
原创 js字符串插入指定字符
var str = 'abc' (例子转换后是有空格的，不需要的话转换时直接去掉空格即可："/ $1 /" =>"/$1/")1. 'abc' => '/ a // b // c /'str.replace(/(.)/g, "/ $1 /")2. 'abc' => 'a / b / c /'str.replace(/(.)/g, " $1 ...
2019-08-20 18:16:09
12441
原创 微信小程序笔记——小程序movable-view实现左滑删除功能
一：前言movable-view(点击查看官方文档)左滑的元素高度需要是固定的，因为movable-view要求必须设置width和height；效果图：wxml：<view wx:for="{{items}}" wx:key="{{index}}"> <movable-area class='movable-area'> <mo...
2019-07-03 11:25:26
5030
2
原创 微信小程序笔记——微信小程序appjs的onLaunch执行完之后再执行Page的onLoad
一：前言小程序网络请求默认为异步请求，在appjs的onLaunch运行后进行异步请求时，程序不会停止，Page页已执行onload, 我们希望onLaunch执行完后再执行onload。解决方法：定义回调函数//app.jsApp({ onLaunch: function () { wx.request({ url: 'http://test.cn/lo...
2019-07-02 14:59:22
18516
7
原创 js防抖和节流 区别及实现方式
概念：函数防抖(debounce)：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。函数节流(throttle)：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。函数节流（throttle）与函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现...
2019-06-25 16:56:03
66722
17
原创 微信小程序笔记——处理小程序页面栈限制（小程序wx.navigateTo封装）
一、前言小程序中页面栈最多十层，随着页面增加路由跳转很容易在不知道的情况下就会堆栈到十层，再用navigateTo去跳转就跳不动了。这时候就需要删除当前页面栈（redirectTo）或删除所有页面栈（reLaunch）来跳转了。页面栈可以通过getCurrentPages方法获取。1、新建jsnavigateRoute.jsfunction navigateTo(url)...
2019-06-25 14:45:46
4567
原创 微信小程序笔记——微信小程序request请求封装
一、前言微信小程序提供的wx.request请求API，文档介绍的很清楚。直接使用代码未免累赘，并且处理一些返回操作不好统一处理，所以就对wx.request做了一下封装。1.新建js文件（request => index.js）// let baseUrl = 'http://******/'; //测试// let baseUrl = 'http://******/'...
2019-06-25 14:00:00
1736
5
原创 微信小程序笔记——小程序授权登录封装
一、前言产品需求：在游客模式登录下，用户做某些操作（如：评论，点赞。。。）时，需要拉起小程序授权登录，在没有单独登录页的情况下（为了方便可以让产品&UI出一个单独的登录页），封装一下小程序授权登录就比较方便了。1、组件编写新建Component => authorauthor.wxml:<!-- 未登录情况下拉起授权登录按钮 --><b...
2019-06-20 11:44:37
5374
3
原创 Vue.js结合Canvas制作二维码和图片的合成（html2canvas + Canvas2Image）--整理
之前写过一篇关于二维码和图片合成的博文，但是存在一些问题，本篇是本人整理最后在项目中使用的。建议：如果是单张背景图或者是多张背景图且二维码在同一位置的话，建议直接在后台合成分享图直接给前端返回即可，我这次项目需求是多张背景图并且二维码的位置都不同，后台不方便处理，所以直接前端来处理了。需求背景：分享图片，图片中含有自己分享链接生成的二维码！！大体思路：第一步、将自己的分享码或...
2019-03-18 20:40:40
6424
3
原创 vue input输入框关键字筛选检索列表数据展示
想必大家在项目开发中难免会用到关键字筛选的功能，正好这次项目有需求要做这一块，就整理一下vue的input输入框输入关键字检索数据列表的代码。下面直接上代码：html：<!-- 筛选demo --><template> <div> <input type="text" v-model="search"> ...
2019-01-24 17:43:13
24551
7
原创 make sure to provide the "name" option. vue循环引用组件报错问题
最近在开发项目中遇到引用组件老是报错：[Vue warn]: Unknown custom element: <is-notice> - did you register the component correctly? For recursive components, make sure to provide the "name" option. 在我的项目中错误只发生在首页...
2019-01-15 11:59:15
19475
2
原创 vue之img标签:src地址拼接 --随记
背景：图片为本地资源，根据后台返回的icon（图片名字/标记）匹配本地图片。代码：（假数据）<template> <div> <ul class="gift_main_list" v-if="tabIndex == 1"> <li class="list_item" v-for="(it
2018-12-13 17:32:59
35629
14
原创 vue2+axios 请求拦截器及路由拦截器封装（笔记）
axios依赖安装：npm install axios -S 新建axios文件夹-> baseUrl.js & index.js & router.js main.js 引入//axios封装import './axios' js介绍：baseUrl.js：baseUrl.js 简单区分开发环境、测试环境及生产环境 ，之前有篇文章已经介绍 ...
2018-12-07 11:26:05
5009
2
转载 vue之menu弹出菜单效果
先上效果图，这个项目的github可以看一看从上图中，我们可以看出界面主要分为menu和item2块，其中menu的动画是自传，item的动画是位移，然后这里我们通过绝对布局的方式将整个控件定位在四个角落。.menu_container { position: absolute; z-index: 100; border-radius: 50%; tr...
2018-11-16 09:58:31
4664
1
原创 Vue.js结合Canvas制作二维码和图片的合成（qrcanvas + html2canvas）
(这个有问题，最近会把整理后的更新上去！！！！！！)最新最新！！！：https://blog.csdn.net/zuorishu/article/details/88632978需求背景：分享图片，图片中含有自己分享链接生成的二维码！！大体思路：第一步、根据自己的分享链接生成一张二维码； 第二步、结合一张图片合成带分享二维码的大图；开干：首先来生成二维码，之前都是使用...
2018-11-09 10:38:57
17392
11
原创 vue2结合qrcanvas生成二维码
一. npm安装 npm install qrcanvas二. 在用的页面引入import { qrcanvas } from 'qrcanvas';三. html<div id="qrcode" ></div>四.scriptthis.$nextTick(()=> { var canvas = qrcanvas({ ...
2018-11-08 18:45:33
1384
原创 js获取地址栏url参数 亲测好用
代码 ： //获取地址栏参数 function GetQueryString(str) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); ...
2018-11-02 17:48:57
394
原创 时间转时间戳&时间戳转时间格式兼容ios方法封装
废话不多说，直接上代码！！！export default { //时间格式返回 方法一： //data ：传过来的时间/时间戳 type：时间返回格式类型 （可自定义） formatDate: function(date, type) { if (date != undefined) { //兼容ios ...
2018-10-30 15:09:03
1944
原创 vue封装公共方法处理js计算科学记数法精度问题
声明：本文核心是很早之前参考其他大牛的文章或博客，文章出处也找不到了，如有看到请留言，会补上出处。自己稍作改动，一直保留在用。废话不多说，下面直接上在vue中自己如何使用的代码：1.新建公共方法的js文件，我为这个单独建了一个文件：calculation.js 代码：var countDecimals = function(num) { var len = 0; ...
2018-10-17 14:58:23
3621
原创 vue2+elementUI+i18n 国际化语言切换实现
vue-i18n github：https://github.com/kazupon/vue-i18nvue-i18n安装： npm install vue-i18n --save1.src目录下新建i18n文件夹>看下图2. cn.js代码import zhLocale from 'element-ui/lib/locale/lang/zh-CN' //引入elem...
2018-08-15 18:29:51
13666
12
原创 vue2+axios项目简单区分开发环境、测试环境及生产环境以加载不同域名
在main.js 或者你自己配置的api.js中使用，原理：根据获取到的URL的主机名 来判断是开发环境或测试环境或正式环境，来设置不同的baseUrllet baseUrl = '';if (location.hostname == '***') { //测试环境 baseUrl = '***';} else if (location.hostname == '*****')...
2018-08-07 17:12:00
4220
1
原创 vue-cli 项目在IE内核兼容配置参考
问题一：页面内容不显示解决方法：在index.html页面添加如下代码<meta http-equiv="X-UA-Compatible" content="IE=edge" />问题二：语法错误解决办法：下载安装babel-polyfillnpm install babel-polyfill --save然后在main.js引入 import 'ba...
2018-08-07 16:07:42
1850
原创 highcharts编写交易所深度图
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <meta name="viewport" content="width=device-width, initial-sc
2018-07-21 10:20:27
3901
3
原创 vue使用elementUI的el-input监听回车事件
由于elementUI对input进一步进行封装，直接@keyup.enter是没有响应的。使用方法是在事件后面脚上.native<el-input type="password" v-model="form.pwd" @keyup.enter.native="submitForm()" placeholder="Please enter your password"></el-...
2018-07-16 15:14:00
18073
原创 ES6 map()遍历、filter()筛选--随记
map():map和forEach等遍历方法不同，在forEach中return语句是没有任何效果的，而map则可以改变当前循环的值，返回一个新的被改变过值之后的数组（map需return），一般用来处理需要修改某一个数组的值。let arr1 = [1,2,3];let arr2 = arr1.map((value,key,arr) => { console.l...
2018-07-08 14:59:32
69454
原创 vue+elementUI表格关键字筛选高亮
代码：<template> <div class=""> <div class="top"> <!-- 筛选 --> <div class="screen"> <div style="width:30%&
2018-07-03 15:33:34
9787
8
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人