微信小程序学习声明：本文章是基于黑马程序员的课程所编写，本人才疏学浅，内容仅作参考项目和markdown文件资料：微信小程序:基于黑马程序员的微信小程序笔记与项目文章目录微信小程序学习1.环境准备2.小程序结构目录

一、效果图展示模拟器及pc端效果图手机端就不贴了二、把官方示例copy到自己的项目传送门三、改一改上传图片功能insertImage(){constthat=thiswx.chooseImage({//count:1一次选择图片的个数success:function(response){//多张图片上传response.tempFilePaths.map(item=>{wx.uploadFile(

一起加油~！来源：黑马程序员前端微信小程序开发教程目录I.自定义组件①创建②引用1）局部引用2）全局引用3）对比4）页面和组件的区别③样式1）组建样式隔离2）注意点3）修改4）stylelsolation的可选值④数据、方法和属性1）data数据2）methods方法3）properties属性4）data和properties的区别5）使用setData修改properties的值⑤数据监听器1

Taro/微信小程序学习笔记持续更新中一：快捷命令1，快捷创建页面——Tarocreate--name页面名称2，运行到h5页面预览———Tarobuild--typeh5--watch3，本地代码已提交，后又修改了一些文件，想回到提交时的代码——gitcheckout.二：注意事项1，导航使用navigateTo的时候，只支持五层。2，导入Taro-ui用cnpm，不然容易报错。3，图片命名数字

微信小程序笔记整理地址：https://mp.weixin.qq.com/小程序的基本构成pages-->用来存放所有小程序的页面页面以文件夹的格式保存在pages里,每个页面由四个基本文件组成xx.js

微信小程序笔记view默认是vertivalalign默认是水平排列

文章目录目录结构全局配置文件app.json配置项pageswindowtabBar页面配置配置项sitemap配置模板语法text和view数据绑定循环block条件渲染wx:ifhidden事件绑定WXSS尺寸单位样式导入内联样式lessimageswiperswiper-itemnavigatorrich-textbuttoniconradiocheck-box生命周期应用生命周期页面生命周

#目录一、初识微信小程序1、什么是微信小程序Ⅰ-小程序历史2017年度百度百科十大热词之一微信小程序，简称小程序，英文名MiniProgram，是一种不需要下载安装即可使用的应用(张小龙对其的定义是无需安装,用完即走,实际上是需要安装的,只不过小程序的体积特别小,下载速度很快,用户感觉不到下载的过程)小程序刚发布的时候要求压缩包的体积不能大于1M,，否则无法通过，在2017年4月做了改进，由原来的

切换微信小程序问题汇总及详解《三》picker增、删微信小程序问题汇总及详解《四》图片上传和地图微信小程序问题汇总及详解《五》点击发送清空input值微信小程序问题汇总及详解《六》获取form表单初始值提交数据微信小程序笔记

目录（一）页面导航什么是页面导航（二）声明式导航导航到tabBar页面导航到非tabBar页面后退导航（三）编程式导航后退导航（四）导航传参声明式导航传参（五）下拉刷新事件（六）上拉触底事件（七）上拉触底事件案例（八）生命周期什么是生命周期生命周期的分类什么是生命周期函数生命周期函数的分类应用的生命周期函数（九）WXS脚本生命是wxswxs的应用场景wxs和javaScript的关系（十）WXS脚

构成页面的各个文件功能：WXSS文件是一个样式文件，这个文件主要来写一些css样式，这些样式只会针对该文件夹下的WXML文件有作用；JS文件是主要的业务逻辑类，包括这个页面所有的业务逻辑的实现；JSON文件是这个页面的配置，如允许该页面进行上拉加载等；WXML文件是类似HTML的作用，当然它也有一些自己的一些特殊标签。WXML:构建页面；.js:逻辑代码；.wxss：样式；.json：配置文件wh

小程序发展史小程序并非凭空而生，在其未出现前，webview作为web的主要入口。初期开发者通过调用微信原生的一些api进行一些交互，如图片预览等（称为JS-SDK），源于开发者依赖原生功能完成一些难以实现的东西。JS-SDK是对之前weixinJSBrige的一个包装，以及能力的释放虽然js-sdk虽然解决了移动网页能力不足的问题，但其并没有解决使用移动网页遇到的不良体验问题，比如，受限于设备性

腾讯云提出的云开发应该已经有一段时间。至于serverless是什么？不懂的同学可以移步至phodal大神的serverless。腾讯云借助于小程序快速发展走一波serverless。它的优势在于弱化后端和运维概念，让小企业和小团队可以更容易地开发小程序。它首创的云调用将鉴权部分有效的封装，让你的接口很容易的实现了鉴权保护。当然，大公司或者是具有成熟后台团队的公司，肯定不愿意将数据放在腾讯的服务端

这里是作为图片链接使用的文章无须再向下看了，不好意思哈Snip20180130_1.pngSnip20180313_2.png封装参数.png请求结果.pngWechatIMG68.jpeg2018年06月11日15:01:12安卓学习截图Snip20180611_16.pngSnip20180611_17.pngSnip20180621_3.pngSnip20180731_35.pngSnip2

切换微信小程序问题汇总及详解《三》picker增、删微信小程序问题汇总及详解《四》图片上传和地图微信小程序问题汇总及详解《五》点击发送清空input值微信小程序问题汇总及详解《六》获取form表单初始值提交数据**微信小程序笔记

大家好！我是【小黄】，因为我姓黄所以就叫小黄好了。这博客是对自己学习和成长的一点点总结及记录，如果您对我写的还感兴趣，可以关注一下我的动态，我们一起学习、共同成长和进步。书本太薄写尽心中所想，却看不到来日方长。杯盏太浅盛的下唇齿留香，却品不尽尘世沧桑。余生太短，饮下杯中美酒，愿能忘却忧愁。既然此生不能再回首，那就潇洒风流的向前走。就算前路荆棘若虎口，至少还有我和温柔。♡♡♡♡♡♡♡♡♡♡♡♡♡♡♡

一、前言微信小程序提供的wx.request请求API，文档介绍的很清楚。直接使用代码未免累赘，并且处理一些返回操作不好统一处理，所以就对wx.request做了一下封装。1.新建js文件（request=>index.js）//letbaseUrl='http://******/';//测试//letbaseUrl='http://******/';//预发布letbaseUrl='https:

app的生命周期onLaunch生命周期函数--监听小程序初始化当小程序初始化完成时，会触发onLaunch（全局只触发一次）onShow生命周期函数--监听小程序显示当小程序启动，或从后台进入前台显示，会触发onShowonHide生命周期函数--监听小程序隐藏当小程序从前台进入后台，会触发onHideonError错误监听函数当小程序发生脚本错误，或者api调用失败时，会触发onError并带

微信小程序笔记一.⼩程序配置⽂件1.1全局配置app.jsonapp.json是当前⼩程序的全局配置，包括了⼩程序的所有⻚⾯路径、界⾯表现、⽹络超时时间、底部tab等。

微信小程序笔记首先是对微信小程序目录文件理解今天dotolist练习首先是对微信小程序目录文件理解pages:项目开发目录pages里面每一个文件夹都是一个完整的小程序页面，其中内含四个部分分别有xxx.wxml

WXMLWXML（WeiXinMarkupLanguage）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。WXML在小程序中充当类似HTML的角色。数据绑定WXML中的动态数据均来自对应Page的data。简单绑定使用双大括号将变量包起来，作用于：内容{{message}}Page({data:{message:'HelloMINA!'}})组件属性(需要在双引号之内)P

正常来说，微信小程序是依赖于微信客户端上运行的，并且跟小程序基础库（包括了小程序的整个运行环境以及基础能力，跟具体小程序无关）版本有重大关联关系。我们可以把微信客户端以及小程序基础库简称为宿主环境（就算去开发类似于百度小程序、字节跳动小程序、京东小程序，它们的概念都是想通的）。小程序可以调用宿主环境提供的微信客户端的能力，这就使得小程序比普通网页拥有更多的能力。小程序会运行在不同版本（不同的微信客

微信小程序事件对象中e.target和e.currentTarget的区别详解微信小程序wxml传递值总结（e.currentTarget，e.detail.value)揭开正则表达式的神秘面纱在线正则表达式测试不在以下request合法域名列表中怎么办微信小程序填坑之路之使用localhost在本地测试微信小程序wx.requestPOST500(InternalServerError)微信小程

微信小程序订阅号：适用人群：个人，媒体，报纸，企业，政府或其他组织一天只能群发1条消息服务号适用人群：媒体、企业、政府或其他组织。一个月内可发送4条消息企业微信原企业号企业的专业办公管理工具。小程序是一种新的开发能力，开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播，同时具有出色的适用体验。小程序优点：开发周期短，开发成本比APP要低开发难度较低运行速度跟App差不多，也能做出

一：前言小程序网络请求默认为异步请求，在appjs的onLaunch运行后进行异步请求时，程序不会停止，Page页已执行onload,我们希望onLaunch执行完后再执行onload。解决方法：定义回调函数//app.jsApp({onLaunch:function(){wx.request({url:'http://test.cn/login',//仅为示例，并非真实的接口地址data:{},

官方文档地址：https://mp.weixin.qq.com/debug/wxadoc/dev/?t=201715需要下载微信官方的开发者工具，地址：https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=201715一、基本构成1、目录结构2、组成部分由app.js、app.json、app.wxss三部分组成①ap

微信小程序笔记1.利用小程序提供的API跳转：转自：微信小程序页面跳转方法总结//保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面。

整理资料第三方组件库ZanUI这个是老版的，新版的现在是vant-weapp，现在来看这两个可以互补。wux-weapp这个没用过，但是光看效果功能比上面的多。iViewWeapp功能也是十分的齐全。weui-wxss微信官方的UI库，了解下就行。因为上面三个随便选一个，基本也就用不到它了。1.引用组件➡Component  引用第三方组件，和引用自定义组件的方式是一样的（详细请看微信小程序官方文

一：前言movable-view(点击查看官方文档)左滑的元素高度需要是固定的，因为movable-view要求必须设置width和height；效果图：wxml：{{item.content}}删除js:varapp=getApp()Page({data:{items:[],startX:0,//开始坐标startY:0},onLoad:function(){for(vari=0;i30)ret

一、前言小程序中页面栈最多十层，随着页面增加路由跳转很容易在不知道的情况下就会堆栈到十层，再用navigateTo去跳转就跳不动了。这时候就需要删除当前页面栈（redirectTo）或删除所有页面栈（reLaunch）来跳转了。页面栈可以通过getCurrentPages方法获取。1、新建jsnavigateRoute.jsfunctionnavigateTo(url){if(getCurrent

一、IDE界面介绍编辑界面调试界面项目管理界面左侧工具介绍二、项目文件类型及结构介绍这是一个初始小程序的项目目录，其中涉及四种文件类型；*.js：JavaScript文件（JavaScript语法）*.json：json配置文件，一般用来配置参数，例如窗口背景色，窗口字体等等（json语法）*.wxml：布局界面，视图文件（HTML语法）*.wxss：设置样式，样式表文件（CSS语法）创建的初始小

touchcancel手指触摸动作被打断，如来电提醒，弹窗touchend手指触摸动作结束bindtap和catchtap区别bindtap元素绑定事件，父节点绑定事件会冒泡catchtap不会冒泡，仅在当前元素触发事件打印出来有currentTarget：事件绑定的当前组件（冒泡到的对象）target：触发事件的组件dataset：当前组件上由data-开头的自定义属性组成的集合事件的对象：Ba

微信小程序笔记注：个人笔记就是没有大纲、没有目录、没有结构，纯属本人笔记用。

微信小程序笔记三：彩蛋“谁更帅”前端源码github地址在此，记得点星：https://github.com/brandonxiang/weapp-handsome后端源码github地址在此，记得点星

问：代码如下：wx.openLocation({latitude:'30',longitude:'120',scale:18});发现导航功能失效了，怎么办？答：上面的30、120是String类型，改成Number类型就没问题了问：storage的应用场景有哪些？答：参考微信小程序文档里的‘4.6.3利用本地缓存提前渲染界面’这节内容，主要思想：‘我们在拉取商品列表后把列表存在本地缓存里，在on

单位rpxrpx类似于Android中dp，具有设备独立性，最大屏幕宽度为750rpx。字体加粗/*normal,400,bold,700*/font-weight:normal;/*font-style:bold;*/单位vwwhvw、vh是CSS3中的新单位，是一种视窗单位，也是相对单位。width:100vw;height:100vh;/*height:100%;*/与%的区别？%是相对于父

也想不起来什么，只能下次做的时候随手做笔记了，好记性不如烂笔头这句话真是一点儿都没错:动态改变标题wx.setNavigationBarTitle({title:'标题1',})json配置{//配置工程目录"pages":["pages/index/index","pages/route/route","pages/书写想要的路径/书写想要的名称","pages/书写想要的路径/书写想要的名称"

内容大部分来自微信小程序官方文档，主要是对微信小程序一个系统的认识和总结一、指南2）介绍小程序代码构成app.json、app.js和app.wxss，2-1)介绍小程序页面构成page.js、page.wxml、page.json、page.wxss、page.wxs，3）为project.config.json项目配置信息，4）为sitemap.json小程序索引配置1）.小程序与普通网页开发

  效果实现起来不难，主要用到了小程序的动画。滚动计数器{{item}}{{item}}importwepyfrom'wepy';classNumberWheel{constructor(animation=null){this.animation=animation;}}exportdefaultclassIndexextendswepy.page{config={navigationBarTi

Wepy使用记录—Wepy-Redux基本使用  wepy-redux刚开始看的时候真是不知道是啥一头雾水。网上找的资料大部分鬼话连篇。要说良心之作不是没有，请看这篇手把手教你在小程序里使用Redux。这篇讲的是非常不错的，结合wepy示例代码讲的。由于我个人理解比较慢，所以我不得不看了点视频再了解一下。React16.4快速上手（怕直接看下面的不懂，提前积累了点基础）在React中使用Redux

Wepy使用记录—使用组件  在wepy中可已使用原生小程序自定义组件，也可已使用wepy组件，使用上稍有区别。1.使用原生方式的自定义组件  这里引用的是vant小程序组件（这里不用纠结第三方还是自定义，因为这种组件库都是按照小程序自定义组件标准去写的），用vant不用iview原因是，iview编译有报错看着不舒服，但是不影响使用。  因为引用的是自定义标题栏，所以会看着不太明显。所以这里对界

一、文档类型.js:逻辑控制，用于写javascript代码。.wxml:页面结构，用于写html。当然，微信对其有一定的封装，用的话还需要了解其标签。.wxss:样式表文件，用于写css。.json:样式配置，符合json语法格式。用来做其作用域内的设置。小程序包含一个描述整体程序的app和多个描述各自页面的page。1.1以app命名的各个文件是整个app的全局配置文件，其必须放在项目的根目录

微信小程序的初步使用  昨个写了个Vue的小练习，今天再来个微信小程序的练习。数据绑定上大致跟vue的用法差不多，可惜了不会CSS，要不写起来能顺溜不少。这么一看还是写Android顺手。1、创建项目  不得不说小程序的文档写的相当不错，创建项目看微信小程序开发文档就能知道咋回事了，这里留个截图以作纪念。  创建完page后，界面的路径会自动在app.json里配置好。但是注意一下，放在pages

笔记内容：微信小程序笔记日期：2018-1-03什么是微信小程序？

一：微信小程序是啥？微信嵌入式微型APP二：微信小程序特点1.便携便捷体积小相当于无需下载方便随时使用2.自带用户量微信用户量广粘性大相当于自带大量潜在客户3.简便性能要求低，操作简单。4.成本较低开发难度稍微偏低，运维量不大，维护成本低。三：对开发者的影响（APP）1.跨平台适用微信平台中的各种手机系统2.开平台开放式平台，允许各程序员进行开发3.门槛低0基础相对容易入门四：小程序开发基础JS语

 点击后隐藏或显示某一行数据。在小程序开发时，经常需要实现在点击完列表中的某一行数据后，就能展开其对应的相关内容或隐藏其对应的内容 index.wxml方法一aaa{{item.id+1}}bbb方法二aaa{{item.id+1}}bbbindex.wxss.text{background-color:#eee;padding:5rpx;}/*标题*/.title{padding:15rpx;}

1.相关文档微信小程序开发者文档(官网)各大物联网平台对比之微信硬件平台()微信硬件平台(官网)蓝牙4.0,蓝牙BLE模块,蓝牙4.0和蓝牙BLE的区别？AirSyncDebugger使用指南(微信蓝牙协议调试工具)微信小程序开发教程(基础篇)10-滑动操作[经验]跳坑《一百六十七》图表类：折线图，柱状图，K线，分时图微信小程序的一个坑:canvas图表spritejs轻量级的canvas绘图库2

/***微信小程序笔记*/1.文件结构微信小程序官方给与的结构为：projectNamepagesindexindex.jsindex.wxmlapp.jsapp.json这里重点看一下，app.json

微信小程序笔记四：翻译小轮子weapp-i18n正是由于微信小程序已支持个人公众号，又唤起我对小程序的一些“热情”。说实在的，它不过是一个封闭的web框架。

一个简单的开始页面3-2官方种子项目介绍与小程序的文件结构1.以ihhone6,750px的像素设计最佳；750x1334;2.设置style的两种方式：动态样式写在style里，静态写在class样式表里。（1）在wxml文件中设置1（2）在xcss文件中设置.user-avatar{width:200rpx;height:200rpx;margin-top:100rpx;}12-->345he