NAMECZ的博客

一、在 miniprogram 文件夹内 初始化 生成 package.json 文件进入终端后输入命令 npm init生成自定义 package.json 文件或者 输入命令 npm init -y 生成默认 pageage.json 模板完成后miniprogram 目录下会 多出 一个 package.json 文件二、根据 vant 官方文档步骤操作1、下载vant依赖npm i @vant/weapp -S --production2、修改...

准备工作一、脚手架的搭建 1、安装wepy脚手架 npm install wepy-cli -g 2、查看wepy版本（出现版本号说明wepy脚手架安装成功） wepy -v 3、如果脚手架为1.70版本以上，可以先查看项目模板 wepy list ...

倒计时封装函数function GetRTime(v) { var EndTime = new Date(v); var NowTime = new Date(); var t = EndTime.getTime() - NowTime.getTime(); if (t >= 0) { var d = 0; var h = 0; var m = 0;...

大家一定经历过这种需求， 把一个数组（暂且称之为list）的长度作为循环条件，循环过程中做一些判断，然后删除掉list中的某一项，或者多项。如以下代码：let list = that.data.list;for(let i = 0 ; i < list.length ; i++){    if(list.checked){ list.splice(i,1)    }}注意：循环中，...

本人之前也从来没接触过canvas，但是由于对canvas写出来的各种酷炫效果非常仰慕，所以对canvas抱有浓厚的兴趣。今天尝试用canvas写一个最常用的环形进度条，算是我对于canvas的入门。下面先看效果图：直接上代码：wxml： <view class='content'> <canvas canvas-id='bgCanvas' id='c...

第一篇关于Canvas环形进度条的博文获得不少关注度，时隔这么多日才发出第二篇关于Canvas的博文，并不是我懈怠了，而是最近公司比较忙，写好的demo一直没机会发，今天公司终于闲下来了，把我做好的demo整理一下发上来，给喜欢canvas的初学者看看，因为本人也是初学者，所以一下内容仅供参考，有不理解的地方或者有更好的想法，都可以与我联系，互相探讨一下。决定写这个幸运大转盘是因为网上的素材很...

受朋友委托，帮其做一个具有水印的身份证图，时间比较紧张，代码逻辑可能不是最简便的，但是效果不错，有更好的想法的码友可以给我分享一下心得，不胜感激！先上效果图：不同的图片只需要更换不同的图片路径即可，canvas画布的大小受项目影响自行调整。下边上代码：wxml：<canvas canvas-id='myCanvas' style='width:500px;height:500px;backg...

这一篇是写给我自己看的，是我写小程序时遇到的一些问题，现在看来很普通，但是为了纪念我的青春，我还是决定写出来来鼓励我自己继续进步。1、onShow，在页面显示的时候触发此函数，当页面中出现新页面或者遮盖后都会触发，比如地图的选择，和照片的选择等，在返回的时候都会触发此函数，但是在多数情况下这种是不需要执行onShow刷新页面的，这时候为了区分是上个页面返回触发的onShow还是本页面遮盖触发的...

今天写了一个功能页面， 是一个表单的提交页，其中有要求选择省市区的一栏，省市区分别是三个页面。刚开始我的思路是这样的，当我点击选择省市区那一栏，跳转到选择省份的页面，选择好后，携带参数跳转到选择市的页面，然后继续携带参数跳转到选择区的页面，最后携带三个页面的参数跳转回表单页， 乍一想，这样的思路逻辑很清晰，没什么毛病，但在实际操作中出现，当我选择好省市区携带参数跳转回表单页的时候，之前填写的表单信...

最近看到一篇CSS魔幻属性的文章，感触很深，不过我想，与技巧相比，有些常见css布局难题，有时候更加让我们的日常开发变得踌躇沮丧吧。为什么此处li标签内的p元素看起来独自撑开了一行这是我在segmentfault上看到的一个问题，以前自己遇到过，所以就很热情洋溢的去回答了一下，难道遇到个自己会的，示例代码是这样的：   li{       display: inline-bloc...

小程序picker 日期选择中经常要用到 年-月-日 格式的时间，写下来方便以后使用//昨天的时间var day1 = new Date();day1.setTime(day1.getTime()-24*60*60*1000);var s1 = day1.getFullYear()+"-" + (day1.getMonth()+1) + "-" + day1.getDate();...

这次对数组的操作，我们使用es6的新语法来完成，所以在看下边代码之前，我们要了解我们下边要用到的es6中的set集合，和for...of 方法：首先介绍set集合：ES6提供了新的数据结构Set,它类似于数组，但是成员的值都是唯一的，没有重复的值。Set函数可以接受一个数组（或类似数组的对象）作为参数，用来初始化。注意：向set加入值的时候，不会发生类型转变，所以 5 和 '5...

之前用到scroll-view的时候踩过一次坑，解决后，觉得不是什么很深的坑，遂没有做记录，结果这次又用到了，同一个坑又掉进去一次，心里很难受，难受我没长脑子，也难受我眼高手低，所以这一次，我决定记录下来，给自己一个警醒！横向滑动注意事项：1、scroll-view 中使用float无效；2、scroll-view 中使用flex依然无效；3、scroll-view 样式中使...

微信小程序中，上传图片一直是我最烦的东西，尤其是涉及到编辑，新老图片的交替，更是让人头大，所以我写了一个公共的方法来解决这个问题 该方法存放于util.js中//多图片上传 arr需上传图片的数组 fun所有图片都上传成功后的回调函数var uploadImgs1 = function (arr, fun) { let that = this; let num...

废话不多说，先看小程序文档文档上写的清清楚楚可以在cover-view中使用button但是我在实际使用中却碰到在cover-view中使用button，button不显示的问题！项目中底部的button保存按钮是position-fixed固定在屏幕最下方的，列表中有input框，所以在真机滑动列表的时候，input框中的值会穿透button显示出来，令人懊恼！后来将底部...

在工作中频繁用到复选框，于是自己写了个组件，增加其复用性，提高效率。先看效果图：提交后得到一个选中项的id组成的数组下边直接上代码：代码地址为：components/checkGrop/checkGropwxml:<form bindsubmit="formSubmit"> <view class='content'> <!-- 一级菜单 --> ...

此篇文章仅用来作为记录代码的，原理简单易懂！longTap() { var that = this; var img = ""; var url = "https://52oh.com/**********109.png"; wx.downloadFile({ url: url, success: function(ress) { if (res.st...

一、wxml导入其他文件的方法：1、import 方法import 可以在该文件中使用目标文件定义的template；import 有作用域的概念，即只会 import 目标文件中定义的 template，而不会 import 目标文件 import 的 template！写法：<import src="文件路径" />2、include 方法inclu...

首先，要知道css的三条属性。overflow:hidden; //超出的文本隐藏text-overflow:ellipsis; //溢出用省略号显示white-space:nowrap; //溢出不换行这三个是css的基础属性，需要记得。但是第三条属性，只能显示一行，不能用在这里，那么如果显示多行呢？css3解决了这个问题，解决方法如下：display:-we

微信小程序组件化的解决方案从小程序基础库版本 1.6.3 开始，小程序支持简洁的组件化编程。查看自己使用的小程序基础库版本，可以通过在开发者工具右侧点击详情查看：最基本的组件小程序的组件，其实就是一个目录，该目录需要包含4个文件：xxx.jsonxxx.wxmlxxx.wxssxxx.js声明一个组件首先需要在 json 文件

自定义模态对话框实例由于官方API提供的显示模态弹窗，只能简单地显示文字内容，不能对对话框内容进行自定义，欠缺灵活性，所以自己从模态弹窗的原理角度来实现了自定义的模态对话框。wx.showModal(OBJECT)自定义模态对话框涉及文件界面 wxml样式 wxcss事件及方法 js效果图界面代码 .wxml&lt;button class="show-btn" bindtap="showDial...

在wxss里加入以下代码：::-webkit-scrollbar{ width: 0; height: 0; color: transparent;}

&amp;&amp;中第一个表达式为假就不会去处理第二个表达式；第一个表达式为真就处理第二个表达式||中第一个表达式为真就不会去处理第二个表达式；第一个表达式为假就去处理第二个表达式对于 a&amp;&amp;b，如果a为true，则返回b；如果a为false，则返回a；对于a||b，如果a为true，则返回a；如果a为false，则返回b；首先我们来梳理一下一个概念，请你一定要记住：在js逻辑运...

1、创建components目录，在目录下再创建子文件夹放置组件文件（易于区分），模板文件与正常文件一样有js，json，wxml，wxss四种格式。2、在wxml里写入正常的代码，把需要的样式写成变量模式，slot部分承载你要显示的文字，绑定一个事件，举一个简单的例子：view class='content'style='width:{{c_width}};heigh

wx-gesture-lock  微信小程序的手势密码WXCustomSwitch 微信小程序自定义 Switch 组件模板WeixinAppBdNovel 微信小程序demo：百度小说搜索shitoujiandaobu 小程序：石头剪刀布（附代码说明）audiodemo 微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义star 微信小程序开发之五星评分switchCity 微信小程序...

这篇文章是用来解决日常页面搭建是遇见的痛点，比较常见的布局问题在这就不说了。每种情况只介绍我觉得最好用的下边进去正题1、左边div固定宽度，右边div自适应。效果图：代码：2、上边div固定高度，下边div高度铺满效果图：代码：...

此篇文章是本人对setData方法的一些理解，是查阅文档和查找一些其他资料综述的，有所不足希望指正！直接进入正题！一、setData（）方法：1、参数接受一个对象，以key，value的形式表示；2、参数和变量名称一致，可用一个值代替（es6新语法特性）如上图所示，在this.data中设置ceshi这条数据，在方法中，我们定义ceshi变量让其等于that.data.ce...

受朋友委托，做一个6位验证码输入框，本以为很简单，但是在写的时候遇到各种各样的阻力，在网上查阅资料也寥寥无几，后来经过一番思考，终于敲定下来本人最满意的方案，特意发出来让大家参考一下，希望能帮到大家！一、效果图如下：二、代码部分：wxml：&lt;form bindsubmit="formSubmit"&gt; &lt;view class='content'&gt; &lt;bl...

星级评分分成两种情况: 一:展示后台给的评分数据   二:用户点击第几颗星星就显示为几星评分;[html] view plain copy&lt;!--pages/test/test.wxml--&gt;  &lt;view&gt;  &lt;view&gt;一:显示后台给的评分&lt;/view&gt;  &lt;block wx:for="{{one_1}}"&gt;  &lt;image s..

此代码只是一种模板代码，样式丑陋，但是功能完善。需要使用的朋友自己修改样式代码和部分参数达到自己需求！此代码用到的组件是微信小程序的 movable-area 和 movable-view ; 使用简单效果强大省去很多繁琐操作！下边大家看效果图：直接上代码：wxml:&lt;movable-area class="content" style="width:{{area_width}}%"&gt;...

应公司需求，写了一个弹窗日历选择器，感觉用着还不错，封装了一下，分享给大家，希望大家有什么意见可以指出来相互交流共同改进！先上一个效果图：（当天日期为2018-4-18）时间改为5月份的效果图：直接上代码：wxml:&lt;view class="weui-cells weui-cells_after-title" style='margin-top:100rpx;'&gt; &lt;view...

微信小程序 数组（增，删，改，查）等操作实例详解作者： default|标签：微信小程序 数组 数组操作|2017-1-10 10:17微信小程序 数组（增，删，改，查）等操作首先这是原始数据，json的数组。我们尝试对改数据进行操作，同时渲染到页面。1，数据的添加在获取到表单的数据