- 博客(40)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 如何绘制自定义折线图？
3.根据给定的坐表值来计算四个点的位置，连线的坐标就是该点的起止位置，此处使用了uni插件市场的p-canvas来绘制，注意该插件绘制图片在小程序上无法显现，可以按照如下布局。使用hbuiderx编辑器，在新建项目中引入了p-canvas插件，使用uni框架。1.在墨刀中绘制背景图，再在上面画出每个点，根据右边的X、Y即可确定该点的横纵坐标；vuejs、canvas、uni、p-canvas插件、hbuiderx编辑器。仅作总结学习，若需要源码，可联系我获取。
2023-11-01 13:41:06
154
原创 防抖与节流（转载）
节流 : 通俗的讲就是拧紧水龙头让水少流一点，但是不是不让水流了。想象一下在现实生活中有时候我们需要接一桶水，接水的同时不想一直站在那等着，可能要离开一会去干一点别的事请，让水差不多流满一桶水的时候再回来，这个时候，不能把水龙头开的太大，不然还没回来水就已经满了，浪费了好多水，这时候就需要节流，让自己回来的时候水差不多满了。
2023-03-23 18:41:47
257
原创 数组与对象循环笔记
for循环之类的不可以return，但是能正常使用break和continue；数组方法无法中途停止循环，所以都不可以使用break和continue；普通for循环才是最优雅的，优化后的for循环最快。
2023-03-23 17:01:29
303
原创 web分析-手把手教你怎么写小程序事件分析
小程序提供了自定义埋点方法，需要在业务代码中新增对应的代码。区别于小程序已有的页面、用户等埋点，web分析中的自定义的方法往往与业务场景相关。本文会按步骤详细介绍小程序的事件、事件分析、漏斗分析的创建流程。
2022-09-08 14:54:59
1373
2
原创 小程序渐变的五星评价
美团、饿了么很多软件都会带上评价星标，图片展示的方式可以让人非常直观的查看评店铺评价。 该组件可以输入一个数值、即可展示对应的分值。优点：小图标为css+iconfont字体，无需引用 多余的js、css样式或者图片，体积非常小;以小程序组件为例，其他语言也可参考;已经为您准备好base64的图 标，无需您自己生成。本文分为：概述、代码步骤、成品展示、git代码地址四个部分。.........
2022-08-30 15:10:21
1643
原创 微信⼩程序——wxParse使⽤⽅法
wxParse是⼀个微信⼩程序富⽂本解析组件。现在⼩程序⾥⾯⾃带了⼀个组件也能解析富⽂本，但是表现不尽⼈意。所以我还是采⽤的wxParse来解析富⽂本的。下载 wxParse，解压，将 wxParse 放⼊⼩程序中。...
2022-07-05 09:51:17
2023
原创 MarkDown+Hbuilder学习总结
开始前，可以先按下文档结构图的快捷键Alt+w（Mac是Ctrl+w），浏览本文的大纲。标题使用技巧：markdown的列表支持有序列表、无序列表以及特殊的任务列表。同样也是在行前加一个特殊符号，并空格后再跟列表文字内容。有序列表就是有顺序的列表，依靠行前的数字标记顺序。无序列表就是列表不排序，无序列表因书写随意而被更广泛的使用。无序列表有3种前缀，HX里分别用于表示1级列表(Ctrl + Alt + -)、2级列表(Ctrl + Alt + *)、3级列表(Ctrl + Alt + =)。任务列表非
2022-07-04 17:16:52
1378
1
转载 HBuilderX: MarkDown一键分享使用说明
markdown拥有迷人的输入体验，但分享并不方便，尤其是缺少免费、稳定、高速的图床。uniCloud提供了免费、稳定、高速的服务器和cdn。HBuilderX 2.8.7起，基于uniCloud，提供了markdown的一键分享功能。利用uniCloud的前端网页托管，将markdown稳定转成了HTML网页，并发布为在线的URL。您可以把URL发送给任何想要分享的人。同时markdown里涉及的图片也会自动上传到前端网页托管里免费cdn中。...
2022-07-04 16:46:48
1282
转载 adobe xd 白屏闪退 终极拯救方法
官方地址:https://helpx.adobe.com/xd/kb/after-launch-adobe-xd-shows-white-screen-and-crashes.htmlErrorOn Windows, XD shows white screen after launch and crashes.TroubleshootingNavigate to C:\Window...
2019-03-28 14:34:05
2805
原创 几种情况下不要用float
float中文翻译为浮动，很形象的翻译，在CSS很常用，当你需要吧两个块级元素定排放在同一高度上经常会用到float，先看一下float的 属性。先看一下float可能的值：float:left-元素向左浮动float:right-元素向右浮动float:none-不浮动float:inherit-从父类的float属性继承既然说道浮动，那么就有必要提一下浮动的清理，因为如...
2019-01-22 17:40:46
1353
原创 chrome浏览器的跨域设置——包括版本49前后两种设置
做前后分离的webapp开发的时候，出于一些原因往往需要将浏览器设置成支持跨域的模式，好在chrome浏览器就是支持可跨域的设置，网上也有很多chrome跨域设置教程。但是新版本的chrome浏览器提高了跨域设置的门槛，原来的方法不再适用了。下面笔者简单介绍一下新版本chrome的跨域设置方法。版本号49之前的跨域设置先介绍一下老方法，参考了一些网上的教程，其实直接在打开命令上加--dis...
2019-01-22 17:01:40
193
原创 小程序post请求参数中含有&符号，结果url被截掉一部分
情况：在小程序中使用post请求，参数中含有“&”符号，结果发现报错了，原因是url被截掉一部分。解决方式可以将参数转码：一下是对几个函数的解释：1 escape()函数定义和用法escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。语法escape(string)参数 描述 string 必需。要被转义或编码的字符串。 返...
2019-01-21 14:27:12
4061
原创 苹果手机自带左划关闭功能使用方法
在打开该页面时添加如下代码即可mui.openWindow({ url: '../src/changguanliebiao.html', id: 'changguanliebiao', createNew: false, //是否重复创建同样id的webview，默认为false:不重复创建，直接显示 show: { aniShow: 'fade-i...
2019-01-17 11:07:48
4061
转载 Windows系统下配置React Native Android开发环境
本文主要内容是在Window系统下配置Android APP的开发环境，配置过程将会有点麻烦，请大家需要有点耐心。当然大家也可以参考RN官网的配置过程，但实际上很多开发者根据官网步骤并没能配置出完整的RN开发环境。目前RN的最新版本是0.57，我们将以这个版本为例配置Android的开发环境。要配置RN的Android开发环境需要4个依赖：JDK（版本必须是 1.8）Node（版本必须高...
2019-01-17 11:05:42
108
原创 sass在win10上安装
根据 sass官网的文档安装发现有一些坑，自己总结一下sass的安装。第一步：下载ruby。在window10 笔记本下，打开谷歌浏览器，搜索 https://rubyinstaller.org/downloads/， 这里有一个坑是不是越新的版本越好，在2.0-2.5版本之间，我下载的版本是 也可以...
2018-12-24 14:59:40
716
原创 理解vuex -- vue的状态管理模式
vuex是什么？先引用vuex官网的话：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。状态管理模式、集中式存储管理 一听就很高大上，蛮吓人的。在我看来 vuex 就是把需要共享的变量全部存储在一个对象里面，然后将这个对象放在顶层组件中供其他组件使用。这么说吧，将vue想作是一个...
2018-11-22 15:48:46
211
原创 微信小程序例子——顶部tab栏点左右可切换内容，内容中含有轮播
1.内容摘要。 实现顶部tab的切换，按左右按钮可以左右切换，当按到最左边或者最右边，按钮会变暗不可点击，如下图所示。tab里面写了一个轮播，轮播内容有图片和内容，切换的图标在内容下面，因为没有找到这么奇怪的需求，所以也是完全自己写的，有任何不完善的地方希望大家指正。2.主要代码（1）wxml代码<view> <!-- tab栏 --> <view clas...
2018-06-08 17:39:36
5933
原创 微信小程序例子——视频播放cover-view遮盖层显示poster图片不显示和判断移动网络
1. 主要内容总结一下微信小程序中的video组件在需要加poster的情况下有时会失效如何解决。该文还会介绍如何在移动网络的情况下利用cover-view实现显示”您正在使用移动网络，继续播放将消耗流量“的功能。有问题希望在博客下面留言一起讨论。2.主要代码。（1）wxml代码 <video id='myVideo' bindplay='play' Autoplay...
2018-06-08 17:25:53
8446
6
原创 微信小程序例子——获取用户唯一标识openid
1、效果展示2.关键配置2、关键代码1）WXML文件<button>获取用户唯一标识openid</button> openid:{{openid}}session_key:{{session_key}}2）JS文件const APP_ID ='';//输入小程序appid const APP_SECRET ='';//输入小程序app_secret var O...
2018-06-08 16:44:53
28298
6
原创 react-native 初涉猎
1.图标类展示大小问题将父窗口何子窗口属性设定如下即可完成不变形展示： type:{ flexDirection:'row', justifyContent:'space-around', alignItems:'center', backgroundColor:'#fff' }, typeimage:{...
2018-01-22 14:13:39
182
转载 npm install -g react-native-cli 提示npm ERR!
npm ERR! Windows_NT 6.1.7601npm ERR! argv "C://Program Files//nodejs//node.exe" "C://Program Files//nodejs//node_modules//npm//bin//npm-cli.js" "install" "-g" "react-native-cli"npm ERR! node v4.
2018-01-11 00:35:56
1225
原创 如何保证页面在任何情况下不变形
1.首先外面的大的div的css固定；.content {width: 100%;height: auto;float: left;}2.在里面的div给一个百分比的宽度，加上margin：0 auto居中；.content_co{width: 96%;min-width: 1150px;margin: 0 auto;}3.最重要的步骤是给一个最小的保证里面内容...
2017-12-14 21:04:45
1091
转载 vue的条件与循环
原文链接：http://caibaojian.com/vue-js-if-for.html条件v-if 、v-else、v-show、还可以使用template<div v-if="ok">ok</div><div v-else>No</div><div v-show="ok">ok</div&am
2017-11-02 17:17:30
309
1
转载 mui轮播使用问题
组件介绍轮播组件是mui提供的一个核心组件，在该核心组件基础上，衍生出了图片轮播、可拖动式图文表格、可拖动式选项卡、左右滑动9宫格等组件。示例获取slide组件对象var slider = mui('#slider').slider();常用APIgotoItem(index)切换到指定轮播slider.gotoItem(1); //切换至第二
2017-10-20 11:34:03
1056
转载 em和px及其换算方法
在国内网站中，包括三大门户，以及“引领”中国网站设计潮流的蓝色理想，ChinaUI等都是使用了px作为字体单位。只有百度好歹做了个可调的表率。而 在大洋彼岸，几乎所有的主流站点都使用em作为字体单位，也就是可调的。没错，px比em更加容易使用，大部分读者不知道em为何物或者它相当于多少 px。国外人士如此重视网站易用性(Accessibility)，不仅因为其根生蒂固的人文精神，直接原因可能是因
2017-10-19 17:12:38
7985
转载 避免使用不必要的float（display:inline,position:relative）
float中文翻译为浮动，很形象的翻译，在CSS很常用，当你需要吧两个块级元素定排放在同一高度上经常会用到float，先看一下float的 属性。先看一下float可能的值：float:left-元素向左浮动float:right-元素向右浮动float:none-不浮动float:inherit-从父类的float属性继承既然说道浮动，那么就有必要
2017-10-19 17:09:50
491
转载 ul,ol,dl的区别
1.ul是无序列表，也就是说没有排列限制可以随意加li； 可以随意放置 可以随意放置 可以随意放置 .可以随意放置 .可以随意放置 .可以随意放置 2.ol就序列表，会按照你写的li前后依次排列； 我是第一 我是第二 我是第三 1.我是第一 2.我是第二 3.我是第三 3.dl是定义列表，会默认前后层级关系； 我是头 我是内容 我是内容
2017-10-19 17:04:11
2612
转载 设置背景图片的两种方式，并解决手机端背景图片高度自适应问题
1 设置背景图片的两种方式：方式一： .back{position: fixed;width: 100%;height: 100%;display: block;z-index: -100; }方式二：div class="body" id="Background">.body{width: 100%;height: 100%;position:
2017-09-19 15:59:43
16096
2
原创 mui中点击弹出新的菜单栏，修改高度的实现
var he1 = document.getElementById('hei').offsetHeight; document.getElementById('type').style.height = he1 * 2 + "px"; document.getElementById('more').addEventListener('tap', function() { //打开选址
2017-09-18 11:48:19
1572
原创 mui中打开新页面时右滑返回和打开动画
popGesture是styles里面的一个属性 mui.openWindow({ url: '../src/detail.html', id: 'detail', show: { aniShow: "slide-in-right", autoShow: true, //页面loaded事件发生后自动显示，
2017-09-18 11:45:03
2034
原创 mui 顶部选项卡可左右切换报错的问题
将mui代码里的“viewgroup”换成下图中plus.webview.currentWebview().id即可
2017-08-30 14:16:18
767
原创 mui利用javascript dom元素写的唯品会首页上拉加载更多
function pullupRefresh() { setTimeout(function() { mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。 var table = document.body.querySelector('.m
2017-08-17 11:48:50
269
转载 用Javascript往一个Div中插入一张图片
HTML5火了，JS也得炼一炼用Javascript往一个Div中插入一张图片 window.onload = function (){ var bigImg = document.createElement("img"); //创建一个img元素 bigImg.src="http://www.baidu.
2017-08-17 10:21:31
4504
原创 mui 侧滑栏问题
侧滑栏无法滑动初始化mui('.mui-scroll-wrapper').scroll({deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006});可以解决[email protected] - 学习生活，快乐成长示例：初始化scroll控件：mui
2017-07-21 11:39:40
560
转载 echo 懒加载
#基于 echo 前端框架实现的图片延时加载（https://github.com/apicloudcom/demo-echo）移动端的用户更在意网络流量的节约，如果我们总是无意义的为用户加载用户未看到的图片，会使我们的 App 增加很多无意义的流量浪费。 echo.js 很好的解决了这一问题，只有屏幕当前正在显示的图片才会下载到手机本地，这种方式在表象上看起来也更接近原生体验。#
2017-07-10 14:44:13
464
转载 Swipe JS – 移动WEB页面内容触摸滑动类库
想必做移动前端的同学经常会接到这样子的一个需求，就是在移动设备页面上的banner图能够用手指触摸左右或上下的滑动切换，这在移动设备是个很常见的一个效果，其用户体验远甚于点击一个按钮区域，通过手指的触摸操作也是移动设备的中一个特性，我们必须专业化的处理，哈哈。其实实现原理很简单，但平常中自己开发不是很方便。今天就为大家带来这样子的一个轻量级js触摸滑动类库 – Swipe JS。这是一个非
2017-07-10 09:30:50
379
转载 bootstrap汉堡按钮
为了给导航栏添加响应式特性，您要折叠的内容必须包裹在带有 classes .collapse、.navbar-collapse 的 中。折叠起来的导航栏实际上是一个带有 class .navbar-toggle 及两个 data- 元素的按钮。第一个是 data-toggle，用于告诉 JavaScript 需要对按钮做什么，第二个是 data-target，指示要切换到哪一个元素。三个带有
2017-06-22 14:24:35
4983
2
转载 响应式布局
讲到响应式布局，相信大家都有一定的了解，响应式布局是今年很流行的一个设计理念，随着移动互联网的盛行，为解决如今各式各样的浏览器分辨率以及不同移动设备的显示效果，设计师提出了响应式布局的设计方案。今天就和大家来讲讲响应式布局这件小事，包含什么是响应式布局、响应式布局的优点和缺点以及响应式布局该怎么设计（通过CSS3 Media Query实现响应布局）。一、什么是响应式布局?
2017-06-21 15:02:40
206
css+html+jquery+vue实现瀑布流代码包 应用过项目实例，可以加载数据，组件内容丰富可直接使用。
2022-08-10
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人