微信小程序学习

微信小程序学习笔记（详细汇总）

小程序学习笔记一、微信小程序简介二、微信小程序环境准备2.1申请帐号2.2安装开发工具2.3编译预览三、小程序代码构成四、JSON配置4.1[小程序配置app.json](https://developers.weixin.qq.com/miniprogram/dev/framework/config.html)4.2[工具配置project.config.json](https://develo
perfect-code-hzy·2022-02-05 17:52

微信小程序学习笔记

从点开到显示的过程点开微信小程序的一瞬间，微信客户端做了些什么点开微信小程序；初始化宿主环境，加载小程序代码包，如果本地有缓存就用缓存，如果没有缓存就执行网络下载；给APP实例派发onLaunch事件，App构造器参数所定义的onLaunch方法被调用进入微信小程序执行后续的页面逻辑生命周期的触发条件app的生命周期App的生命周期是由用户操作主动触发的，开发者不能在代码里主动调用。只能使用回调函
乌云老湿·2022-02-05 09:51

微信小程序学习笔记之页面配置与路由方式

最近在学习回顾小程序的开发，将一些学习结果做个笔记。参考微信小程序官方文档：developers.weixin.qq.com/miniprogram…一、小程序配置1、全局配置小程序根目录下的app.json文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多tab等。//示例{"pages":["pages/index/index","pages/logs/i
·2021-09-24 15:31

微信小程序学习回顾-4-【零基础】

小程序上传体验审核发布以及版本管理上传体验审核发布流程代码版本管理上传体验审核发布流程在开发者工具中点击上传后，在微信平台上显示是开发版本。这是可以选为体验版本，给其他权限成员体验小程序。体验没有问题后，点击提交审核。微信平台审核结束，有意见则整改。没有则可以再提交转为线上版本，这时大家都可以搜到这个小程序。小程序版本代码版本管理服务端的代码在云服务器中存储，小程序前端的代码又存储在哪才方便自己以
初九简书·2021-06-24 22:35

微信小程序学习笔记

1.学习资料相关1.文档名称描述小程序开发指南通过9章全面介绍小程序环境搭建到使用发布微信开放文档小程序学习新东西最好的方式就是官方文档，建议快速浏览一遍，然后开发中要用到的再查。微信组件示例快速查看组件样式显示flex伸缩布局flex布局全面介绍Promise高级进阶：深度揭秘Promise注册微任务和执行过程自定义组件【官】自定义组件指南,【官】自定义组件官方文档2.学习视频推荐bilibil
Small_Cake·2021-06-19 06:34

微信小程序学习资源视频书籍免费

搜索微信公众号【程序学习员】关注回复“学习”领取小程序学习资源微信小程序源码：大转盘https://github.com/JJYYZJY/wechat-turntable微信小程序源码：电影日历https://github.com/JJYYZJY/wechat-movie-calendar
JJYYZJY·2021-06-06 20:24

微信小程序学习笔记 >flex布局2

flex属性加上之后padding依然会撑大盒子,使用box-sizing:border-box可以不改变原来盒子的大小Documentdiv{width:200px;height:200px;background-color:red;display:flex;padding:20px;box-sizing:border-box;}没有变大的盒子.png
想做一个画家·2021-05-12 19:30

微信小程序学习：location API接口

本文转自：http://blog.csdn.net/eadio/article/details/52790358微信小程序的位置接口共有两个：1、wx.getLocation(OBJECT)获取当前的地理位置、速度。2、wx.openLocation(OBJECT)使用微信内置地图查看位置然后，根据object参数说明，结合module模块化重写了下两个接口在暴露出来引用，让项目更加灵活管理。具体
呦丶耍脾气·2021-05-02 04:26

微信小程序学习(六)：视图容器

1.Viewflex-direction:row:横向布局模式；如果不设置该属性，默认为横向flex-direction:column:纵向布局。界面样式代码注意：1.如果想要改模式有效，父控件必须设置显示方式为flex模式，display:flex;2.要想控件的背景颜色显示出来，必须view设置大小，否则background-color属性无效。2.scroll-view[html]代码区co
微光北下·2021-04-24 18:24

微信小程序学习2.js基本使用之block回调函数使用

微信小程序自学Demo地址对于oc或者swift来说，函数回调是必不可少的，那么在微信小程序中如何使用block回调函数呢？这里以系统弹框为例正常我们调用系统的弹框如下代码wx.showActionSheet({itemList:数组,success:function(res){}})样式如图image.png调用很简单，直接系统api搞定，可是正常我们都是不想在当前js处理逻辑是留下一大串代码，
灯红酒绿映不出的落寞·2021-04-20 10:11

微信小程序学习笔记

（一）阮一峰教程之一：初次上手helloworld示例app.jsapp.jsonpages/home子目录app.js-对整个小程序进行初始化app.js内容只有一行代码。App({});app.json配置文件，记录项目的一些静态配置。app.json采用JSON格式。JSON是基于JavaScript语言的一种数据交换格式，只有五条语法规则，非常简单，不熟悉JSON的同学可以参考这篇教程。a
LuckyStar04·2021-03-07 22:52

微信小程序学习之自定义滚动弹窗

微信小程序虽然有三种自带的弹窗，但是毕竟功能有限，有时候难以满足我们的需求，所以我们可以自己尝试制作自定义弹窗，话不多说，直接上图：其中列表部分支持滚动，所以信息承载能力很强。实现代码：wxml:唤出弹窗标题副标题{{item.name}}×{{item.quantity}}{{item.message}}此处可随意添加文本内容取消确定wxss:.showModal{position:absolu
·2020-12-21 10:08

微信小程序学习---view-scroll的使用注意事项

当是垂直滚动的时候,官网的实例即可完成当是水平滚动的时候,注意:css文件要求一定要将scroll-view容器设置宽度,并设置white-space:nowrap;一定要将scroll-view容器的每一项都设置宽度和display:inline-block.a-scroll{width:100%;height:300rpx;}.my-scroll{width:100%;white-space:
guxiansheng1991·2020-09-17 16:53

微信小程序学习日记---小程序与H5应用的差异

前言:小程序与H5APP开发有一定的相似性,然而微信团队为小程序提供了独特的文件格式WXML和WXSS分别对应H5APP的HTML和CSS.1.Javascript的限制出于安全考虑,通过传入字符串来执行代码的能力都被禁用了(newFunction,eval,Generator).由于小程序并非运行在浏览器中所以,与浏览器相关的对象模型(BOM)相关的API都没有,所以document,windo
爱憎分明丶·2020-09-17 05:32

微信小程序学习----域名不合法问题

1.域名不合法问题解决方案1将域名合法化，然后在开发者工具中清理缓存解决方案2不校验域名合法性怼起来
TCMvines·2020-09-17 03:48

微信小程序学习笔记二：自定义组件和自定义分享功能

5.自定义Component使用Componet类编写一个Componet配置Componentjson中的component为true-表示开启了component模式在需要引入页面的json文件中的usingComponent中注册(路径注意要指到.js文件)在需要引入的页面中进行引入即可6.使用button实现分享功能实现思路：使用share-btn的外部容器实现一个自己想要的效果使用but
月半叫做胖·2020-09-17 01:56

微信小程序学习之triggerEvent

1.tag/index.wxml2.tag/index.jsproperties:{text:String},methods:{onTap:function(event){this.triggerEvent("tapping",{text:this.propertie.text},{})}}3.在父组件页面上要引入子组件1.detail.wxml2.detail.jsonPost:function
问题制造者。·2020-09-16 18:02

微信小程序学习心得

前后端交互js文件使用data初始化变量、wx.request()请求文件内容，请求成功后setDate（{}）赋值数据，即可在wxml中使用（这里需要知道后端接口的网址）得到的内容如果是数组，删除线格式可以在wxml中通过循环获取数组内的下一个数据如何将数据传入自定义的组件当中？1、获取数据对象在wxml中获取{{item}}，并且使用已经在组件属性中定义为对象的变量承载2、将该变量使用在组件的
MMMMMMorty·2020-09-16 10:42

微信小程序学习 下滑刷新、触底上滑刷新

入门学习使用的是测试号。由于访问了https地址获取数据，需要如图设置：下拉刷新需要在app.json中配置："enablePullDownRefresh":truejoke.wxml代码如下，对应的wxss文件就看个人喜好了，对于text对应的class，只设置了width:90%，不让文字靠近屏幕边侧：{{joke}}对应的joke.js代码如下,注释应该很清楚了：下滑刷新数据，触底时上滑刷新
古月今犹在·2020-09-15 20:28

微信小程序学习笔记（十五）switch开关选择器

wxmljsswitchChange:function(e){console.log(e.detail.value)}
huangyuxin_·2020-09-15 10:36

微信小游戏开发Canvas资源汇总

Demo：微信小程序demo组件：股票分时图微信小程序小组件：仿直播点赞气泡效果，基于Canvas优质demo推荐：二维码生成器；使用canvas与纯JS版二维码生成微信小程序学习用完整demo：canvas
aifupi7268·2020-09-15 10:47

微信小程序学习——view的显示与隐藏

微信小程序学习——view的显示与隐藏需要在全局数据块中，设定一个控制键。data:{......
Brindy_Z·2020-09-14 18:44

微信小程序学习笔记(一): 基础环境配置

0.VSCodetypescript环境搭建开发工具微信开发者工具(用于调试，也可以用默认编辑器编写原生小程序代码)下载地址nodejs和npm(微信小程序现在支持npm包了，而且编译的时候也要用)国内镜像地址npm换源$npminstall--registry=https://registry.npm.taobao.org需要安装的插件minappwechat-snippetwepysnippe
月半叫做胖·2020-09-14 14:03

微信小程序学习笔记1——开发环境搭建

参考内容：http://kf.qq.com/faq/140806zARbmm161103ri2y2Q.html开发参考：https://mp.weixin.qq.com/debug/wxadoc/dev/?t=2017112什么是小程序？它赋予微信一种扩展能力，通过微信提供的API，可以让开发者调用硬件，从而实现一些APP的功能。它目前可以通过扫描二维码、全名搜索的方式进行进入，也可以通过在微信群
谢厂节_编程圈·2020-09-14 13:19

微信小程序学习笔记(一)

1.新添加页面，找到app.json，在pages中加入写的路径会自动生成文件2.页面跳转方式，传参数：wx.navigateTo({url:'../home/home?title='+app.globalData.userInfo.nickName,})url:跳转路径+“？”传参数名字+所传递参数，动态传递参数可以参照以上写法获取页面参数：onLoad:function(options){th
weixin_30576827·2020-09-14 12:21

微信小程序学习之授权登录

创建云开发小程序微信开发者工具》项目》新建项目》小程序》云开发》创建2.创建好后的云开发项目会自带几个测试demo,当然，还不能使用，接下来开通云环境。在开发者工具工具栏左侧，点击“云开发”按钮即可打开云控制台、根据提示开通云开发、创建云环境。开通好后就能在云开发控制台进行数据操作啦。3.小程序绑定服务控制台环境，（默认为第一个环境）相当于绑定服务器。云开发控制台》设置》环境设置》复制环境ID》返
我是逗逼·2020-09-13 21:29

微信小程序学习（1） —— 文件结构

文件结构示例目录：HelloWorld*******************************************************分割线********************************************************全局文件app.js文件这个是小程序的脚本代码文件，可以在这个文件上进行监听，并处理小程序的一些生命周期（比如一些全局变量）在这个ap
na_xie_nian·2020-09-13 12:17

【微信小程序学习日记__01】全局配置文件

【微信小程序学习日记__01】之前接触过小程序项目，但都是拿别人写好的轮子拼装的，终于放假有时间系统学习一下微信小程序。
文学编程第一人·2020-09-12 18:56

微信小程序学习之路（三） 悬浮客服按钮

我写的悬浮按钮，是参考官网文档，并稍加修改得到的官网地址：https://developers.weixin.qq.com/miniprogram/dev/component/movable-view.html废话不多，看代码movable-area是movable-view可移动的区域，如果需要添加内容，比如展示信息之类的，可以放在movable-view标签的前面。且，page的height设
宸寰·2020-09-12 04:08

微信小程序学习之路（四）单张图片上传，预览，长按删除

先看截图，再看代码图1使用样式，明确我们上传图片的位置，即红框之内。图2：点击红框，打开图库。手机测试，可顺利打开图库，可拍照。图3选中图片，成功上传至红色方框内。图4,点击预览，手机端测试可放大查看图片图5鼠标点击超过两秒弹出窗口询问是否删除点击删除，提示删除成功。第一次写的时候，参考官方文档写出来，希望第一次点击能够上传图片，第二次点击能够预览图片，抱着试试的态度，就写demo，然而结果就是，
宸寰·2020-09-12 04:08

微信小程序学习之路（二） 循环添加信息块

有时候，我们可能会需要这样一个功能，即把数据库里的信息按照条目一条一条展示出来，类似于这样，两条或者更多，即数据库读出来有多少条数据，就展示出多少条数据这就离不开block了.block仅仅是一个包装元素，不会在页面中做任何渲染，只接受控制属性。因为wx:if是一个控制属性，需要将它添加到一个标签上。如果要一次性判断多个组件标签，可以使用一个标签将多个组件包装起来，并在上边使用wx:if控制属性。
宸寰·2020-09-12 04:08

微信小程序学习笔记（十六）textarea

auto-height自动变高bindfocus光标聚焦事件bindblur光标失焦事件bindinput当键盘输入时，触发input事件
huangyuxin_·2020-08-26 23:18

微信小程序学习（六）：隐藏单个页面的标题栏（导航栏）

隐藏单个页面的标题栏（导航栏）这个问题我遇见很久了，一直没有解决，一开始我看网上说是目前不支持，今天看的时候，突然发现了好多说怎么做的，以下是解决办法，请坚持看完首先就是代码"navigationStyle":"custom"这个放到需要隐藏的页面，我放上去之后是这个样子的本来以为不好使，但是看了看文档，文档上说是在微信7（好像是6.6，具体忘了）版本后就支持了，所以就真机预览了一下，结果就好使了
我血条子呢·2020-08-26 09:48

微信小程序学习之路(二) ------ 组件

组件视图容器viewhover-class,指定按下去的样式类，不指定hover-class没有点击特效hover-start-time,按住后多久出现点击态(默认50ms)hovar-stay-time,松开后点击态保留多久(默认400ms)//logs.wxmlflex-direction:row123flex-direction:column123//logs.wxss.flex-wrp{d
xeanyee·2020-08-25 11:38

微信小程序学习(2):小程序目录结构介绍

1.微信小程序目录结构微信小程序默认的目录结构，下面一一介绍：1.1小程序的文件格式介绍在项目中我们可以看到四种文件类型：.js后缀的文件是脚本文件，页面的交互等代码在这里实现；.json后缀的文件是配置文件，主要是json数据格式存放，用于设置程序的配置效果；.wxss后缀的是样式表文件，类似于前端中的css,用于对界面进行美化；.wxml后缀的文件是页面结构文件，用于构建页面，在页面上增加控件
道虽迩，不行能至否·2020-08-25 04:59

微信小程序学习笔记——常见组件【swiper】

swiper滑块视图容器。其中只可放置swiper-item组件，否则会导致未定义的行为。常用属性autoplay自动轮播interval修改轮播时间circular衔接轮播indicator-dots显示指示器分页器索引器indicator-color指示器的未选择时的颜色indicator-active-color指示器的选中时的颜色属性类型默认值必填说明最低版本indicator-dotsb
有蝉·2020-08-24 09:07

微信小程序学习笔记（2）----HelloWorld分析

写在前面在学习HelloWorld之前首先需要破解微信开发工具，前面一篇有相关破解教程：http://blog.csdn.net/whzhaochao/article/details/52691550IDE结构上图是微信开发工具自动生成的一个HelloWorld，微信小程序的开发、调试都在这个工具中完成，相比于eclipse、Idea之类的Idea，小程序显示功能比较少，没多少菜单。编辑编辑菜单中
赵侠客·2020-08-22 19:31

微信小程序学习（七）——生命周期

一.应用生命周期1.应用第一次启动就会触发的事件——onLaunchonLaunch事件一般用于在应用第一次启动的时候获取用户的个人信息2.应用被用户看到的时候触发的事件——onShow演示方法：先切后台再选择页面，或者程序重编译的时候都会出现这个事件的调用onShow事件一般用于对应用的数据或者页面效果重置3.应用被隐藏的时候触发的事件——onHide演示方法：切后台就可以隐藏页面了onHide
秃头的毛睿·2020-08-22 19:21

微信小程序学习：（二）app.js及index.js详解

微信小程序学习：（二）app.js及index.js详解项目地址：https://github.com/leoricding/-在用ide创建小程序项目时，系统默认为我们创建了一个helloword的样例模板
老道忘了·2020-08-22 19:52

微信小程序学习（一）——组件

微信小程序入门学习上次已经简单介绍微信小程序入门的准备，今天就继续微信小程序开发学习。什么是组件？组件，是视图层的基本组成单元，自带一些功能和微信风格的样式，通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内属性：属性类型共同属性特殊属性组件view视图容器，用来在页面划分区域块srcoll-view与view相同功能，但可以滚动。通过加高度实现竖向滚动（wxss-height）
LullabyLY·2020-08-22 18:15

微信小程序学习：如何在手机上查看调试微信小程序&如何使用sublime开发微信小程序

之前创建小程序的时候，没有填AppID，导致不能预览。so，想要在手机上查看调试微信小程序，一定要填AppID。--------------------------------------------------------------正经的分割线------------------------------------------------------sbulime通过“sublime-snip
一杯冰啤·2020-08-22 17:09

微信小程序学习（一）（import和include、页面路由、文件格式、条件渲染、列表渲染）

微信小程序WXML提供了import和include引用方式WXML提供两种文件引用方式import和include。importimport是用来导入模板。includeincludes用来导入除模板以外的内容。importimport可以在该文件中使用目标文件定义的template，如：在item.wxml中定义了一个叫item的template：1. 2. 3. {{text}}4. 在in
简单说鸭·2020-08-22 16:36

微信小程序学习（1）_微信小程序简介

一、微信小程序的来源在2016年9月中，微信公众平台向外发出200个小程序内测邀请函，那么什么是微信小程序，有什么功能呢？微信小程序尽管叫小程序，但其实这就是今年年初腾讯曾对外提及的微信“应用号”。早在2016年1月份的微信公开课上，微信之父张小龙就透露微信即将推出应用号。张小龙曾说，让创造发挥价值，好产品应该是用完即走，微信应该是给用户提供便利，而非浪费时间。希望用户在微信里看到的都是自己愿意看
fuck两点水·2020-08-22 16:12

技术文：微信小程序在微信APP里如何运行的？

「H5程序俱乐部」是一个专注微信小程序学习交流，相关外包/招聘需求信息发布的微信公众号小程序是如何在微信App里运行的呢？微信App里包含javascript运行引擎。
packlee·2020-08-22 15:59

今天继续微信小程序学习

微信小程序的组件的使用今天的项目需要使用scroll-view组件，在微信小程序文档中横向滚动的效果在我的页面上无法演示。光看代码也不知道怎么使用，我就把所有代码写入开发程序里发现，只需将要横向滚动的内容渲染到scroll-view标签中例：{{item.name}}在wxss文件里要给scroll-view标签设置内容不换行以及内容元素改行内块.scroll-view_H{/*内容不换行*/wh
G_XUI·2020-08-22 15:41

微信小程序学习成果分享

前言下面由我为大家分享一下这段时间关于小程序的学习成果，如果有什么说的不对，说的不好，说的不完整的还请大家及时补充。关于小程序的简介我在这里就不多说了，大家每个人都应该对他有一些了解，作为一个开发人员，今天我们主要说说小程序的开发。如何快速的学习它我认为首先我们应该对比一下，他和我们传统H5页面的有什么不同。开发工具的使用微信小程序API项目目录结构小程序有四类文件，分别是.wxml,.wxss,
生活也许是一首诗·2020-08-22 04:52

微信小程序学习笔记之页面布局

本次主要学习页面的一些基本布局本次页面布局分成三段，第一段，屏幕上的滑动页面（原谅我电脑上没有正常图片hiahiahia）.selection{border-bottom:2pxsolid#ddd;}需要注意的是，wx：for这个条件渲染，并不是必须使用的，因为教程里用了，所以我也使用了，我对条件渲染这个内容还不是特别精通。如有错误，还请指正。以上，滑动页面就做好了如果需要设置更多关于swiper
silverg·2020-08-21 16:13

微信小程序学习笔记四（常用的方法）

注意：微信小程序不存在跨域问题。在微信web开发者工具中，使用wx.request发出请求时，需要取消验证域名。wx.request(object)发起请求常用的参数：参数名类型说明urlString开发者服务器接口dataObject、String、Array请求的参数methodString（必须大写）OPTIONS,GET,HEAD,POST,PUT,DELETE,TRACE,CONNECT
wss5·2020-08-20 13:38

微信小程序学习笔记——常见组件【view , text】

https://developers.weixin.qq.com/miniprogram/dev/component/常用布局组件view,text,rich-text,button,image,navigator,icon,radio,checkboxview代替原来的div便签属性类型默认值必填说明最低版本hover-classstringnone否指定按下去的样式类。当hover-class
有蝉·2020-08-20 13:31

微信小程序学习笔记三（常用的组件）

视图容器view属性名类型默认值说明hover-classStringnone指定按下去的样式类，为none时，没有点击态效果hover-stop-propagationBooleanfalse指定是否组织本节点的祖先节点出现点击态hover-start-timeNumber50按住多久后出现点击态，单位毫秒hover-stay-timeNumber400手指松开后点击态保留时间，单位毫秒可滚动视
wss5·2020-08-20 10:33
上一页 1 2 3 4 5 6 7 8 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他