微信小程序学习

微信小程序学习之路03-最简易的音乐播放器

今天继续玩小程序的api，看着别人例子跟着做一个小程序，留下一个脚印吧。末尾附上github源码地址。实现以下微信小程序的音乐播放器，先看下效果图界面做的确实挺丑的，先上wxss文件//index.wxss.button-style{background-color:#eee;border-radius:8rpx;margin:20rpx;}只是顶一个简单的按钮的圆角和间距，颜色这个我还是用pri
不应有的淡定·2020-08-19 19:48

微信小程序学习之-最简版页

我们来添加必要的代码。在根目录下创建app.json，其内容如下。{"pages":["pages/index/index"]}在根目录下新建pages目录，然后在pages目录下新建index目录，接着在index目录下创建两个文件index.wxml和index.js。index.wxml的内容如下所示。HelloWorldindex.js的内容如下所示。Page({})通过编写以上短短的几行
David_Ming·2020-08-19 03:37

微信小程序学习：（一）目录结构

微信小程序学习：（一）目录结构卷首语：小程序开发跟前端SPA开发类似，如果学习过react、vue等框架，那么看看小程序的开发者文档，基本上2、3天就能上手，简单、粗暴、快捷。
老道忘了·2020-08-18 23:05

微信小程序学习笔记二（数据绑定）

小程序介绍利用XML+CSS+JS编写移动应用程序微信小程序的一大特性就是：动态绑定数据。数据绑定（基本语法）假设在pages内的index文件夹下：index.js中的代码Page({//有一个data属性data:{greeting:"HelloWorld",textColor:"blue",isShowError:false,isLoading:true,num1:100,num2:200,
wss5·2020-08-18 05:03

哪些服务和企业最适合做微信小程序？

「H5程序俱乐部」是一个专注微信小程序学习交流，相关外包/招聘需求信息发布的微信公众号应该说，不是所有的服务都适用小程序，但大部分的服务和几乎所有的初创业务都是可以接入小程序的。
weixin_jack·2020-08-16 16:57

微信小程序学习第二课：微信小程序自定义顶部导航栏（兼容适配所有机型）

1、将constvm=thisstatusBarHeight:wx.getSystemInfoSync()['statusBarHeight']titleBarHeight:wx.getSystemInfoSync()['titleBarHeight']wx.getSystemInfo({success:function(res){console.log(res);lettotalTopHeigh
微道道·2020-08-15 18:06

微信小程序学习笔记五（持续更新）---小程序上传文件

项目中需要用户上传图片，需要实现，上传按钮默认为一个，在上传一张图片之后，自动增加一个上传按钮，上传三张图片后按钮消失。实现思路：1、图片路径存储在一个数组中，增加和删除图片是对数组进行操作；2、仅一个按钮，添加计数器，num=1;当num==3时，设置按钮隐藏。直接上代码：.wxml文件：+添加图片.wxss代码：.uploader{position:relative;width:175rpx;
ankuaji8631·2020-08-15 18:51

微信小程序学习笔记四（持续更新）---征服scroll-view下拉刷新

贴图大概实现这种使用swiper做tab切换，数据页面下拉刷新的效果。官方提供的scroll-view作为容器，如果在scroll-view使用onPullDownRefresh实现下拉刷新，会存在页面刷新卡，并且刷新会出现在tab之上，用户体验极差。这里先来一波参考文档：scroll-view微信官方文档scroll-view下拉组件---来自其他大神自己封装的组件，强推！实现思路还是scrol
ankuaji8631·2020-08-15 18:51

微信小程序学习（一）：开发准备、授权与验证

今天学习了下小程序，感觉与web开发差别不大，如果学过vuereactangluar等mvvm框架的话，基本无门槛，只需要熟悉一下微信小程序的开发模式和api即可；路由有点区别，需要注意下看看API。本地测试时是没有https的，需要在开发工具右上角详情里勾选不校验..以及HTTPS证书。有时候需要真机测试，但是自己把后台上传到公网太麻烦，这里安利一个内外网穿透工具，直接将本地ip:port映射成
欧阳陈曦·2020-08-15 05:59

微信小程序（版本、成员权限、编写设计理念）

微信小程序（版本、成员权限、编写设计理念）微信小程序学习不同于其他编程语言，因为小程序是微信旗下的产品开发，所以需要对微信的一些理念、价值观、规定等做下了解，避免后期无意触碰微信官方规定红线，遭到封号或其他处罚
永不脱发的程序猿·2020-08-14 08:06

微信小程序学习 --- 第三天、第四天

这2天都是主要学习css的基本使用，所以就写在一起了。第三天CSS（cascadingstylesheets）层叠样式表一：引入方式行内样式直接写在标签里面，用作style属性。可重用度低。内部样式写在head标签里，用作style标签。...只能在一个页面内重用。外部样式写在head标签里，用作link标签。可重用度高二：选择器通用选择器*：是一个通配符，代表作用到所有元素上面。标签选择器div
Irisruye·2020-08-14 08:03

微信小程序学习笔记---liunx 搭建phpstudy并配置ssl（腾讯云apache）

1.安装phpstudyPHPstudy官网地址有介绍http://lamp.phpstudy.netwget-chttp://lamp.phpstudy.net/phpstudy.bin#下载chmod+xphpstudy.bin#权限设置./phpstudy.bin#运行安装#安装时间看配置而定phpstudy(start|stop|restart)#phpstudy开启关闭重启phpstud
一个老年程序员·2020-08-14 03:53

微信小程序学习笔记---底栏特效

熟悉微信小程序的朋友可能了解在定义小程序的底栏，一般只能固定操作。在微信小程序的官方文档中，我们发现做一个底部固定的菜单是可以在app.json上配置上去进行配置的，这样的功能非常强大，但是那些菜单的样式留给我们自定义样式的却不多，比如一下的这种菜单的话。在用app.json配置就凉凉了像这种自定义的菜单呢，最好的还是做成模板了，接收数据，可复用也高了。首先呢，模板的作用和具体可以去看下官方文档。
一个老年程序员·2020-08-14 03:53

微信小程序学习笔记---小程序的拖拽、缩放和旋转手势

在开发中，有时会遇到像App中的手势那样的效果，下面就仿照App实现了一下。wxml部分：{{msg}}wxss部分：page{width:100%;height:100%;background:#ffffff;}.touch-container{width:100%;height:100%;padding-top:0.1px;}.msg{width:100%;height:60rpx;line-
一个老年程序员·2020-08-14 02:18

微信小程序学习笔记——第一弹：小程序代码结构

近来被微信小游戏强势刷了一波后，萌生了学习微信小程序/小游戏的冲动~作为一个马上就要毕业的学生狗(｡☉౪⊙｡)，学习一下新技术，顺道还能丰富自己的简历，简直不能再美滋滋了~~~学习笔记会持续更新至完成第一个小程序实例，如果以下对小程序的理解有错误的地方，请这位有缘的看官好心修正，小生感激不尽(≖‿≖)✧~以下内容是参考、归纳微信小程序开发文档而来~//=======================
Mentina·2020-08-11 05:13

【微信小程序学习之路】----使用template模板所遇到的问题

官方文档的demo过于简单，本人尝试几次也没有弄懂，找了几个demo后才渐渐了解清楚小程序的模板是怎么玩的。并且展示一个简单的demo首先来看我们的项目结构：主要用到index.js，index.wxml，temp.js，temp.wxml首先，我们在根目录下创建一个文件夹：templates,用于存放模板页面（temp.wxml）和模板样式文件(temp.wxss)然后我们对模板文件temp.w
tomatocc·2020-08-10 10:05

微信小程序学习（2）-云开发

微信小程序-云开发微信小程序学习（1）微信小程序学习（2）文章目录微信小程序-云开发初始化+云函数的坑云函数使用老陈段子小程序云存储小程序云数据库初始化插入简单查询更新数据删除数据Aggregate联合查询
mus_木司·2020-08-10 10:42

微信小程序学习

1.全局配置pages字段用于描述当前小程序所有页面路径window字段用于定义小程序所有页面的顶部背景颜色，文字颜色定义等tabbar字段用于定义客户端页面底部或顶部的菜单栏networkTimeout字段各类网络请求的超时时间，单位均为毫秒。2.页面配置3.sitemap配置小程序根目录下的sitemap.json文件用于配置小程序及其页面是否允许被微信索引，文件内容为一个JSON对象，如果没
小笨蛋和小戏精·2020-08-10 08:50

微信小程序01获取昵称和头像

微信小程序学习笔记2020/01/03一.页面创建1.全局三个文件分别是app.js，app.wxss，app.json（名称不可更改）2.创建Pages目录页面（作用是用来放各个页面的）3.创建页面（
xmtpinnnk·2020-08-10 08:05

微信小程序学习（1）-基础开发

学习微信小程序微信小程序学习（1）微信小程序学习（2）文章目录学习微信小程序注册和初始化小程序配置tabbar导航栏模板插样与WXML循环渲染条件渲染模板微信小程序脚本WXSmodulerequiresrcdemo
mus_木司·2020-08-10 08:54

微信小程序学习笔记——用promise封装原生的请求

在request文件夹里的index.js写方法exportconstrequest=(params)=>{returnnewPromise((resolve,reject)=>{wx.request({...params,success:(result)=>{resolve(result)},fail:(err)=>{reject(err)}})})}模块中使用import{request}fr
有蝉·2020-08-09 23:31

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

image基础库1.0.0开始支持，低版本需做兼容处理。图片。支持JPG、PNG、SVG、WEBP、GIF等格式，2.3.0起支持云文件ID。1.图片有默认大小，默认宽高为3202402.mode决定图片内容如何和图片标签宽高做适配①scaleToFill默认值不保持纵横比缩放图片，使图片的宽高完全拉伸至填满image元素②aspectFit保持宽高比确保图片的长边显示出来场景：页面轮播使用③as
有蝉·2020-08-09 23:59

微信小程序学习三(wxml语法)

主要记录学习过程中使用次数较多的内容官方文档-wxml语法参考数据绑定wxml中的动态数据均来自对应的Page的data简单绑定数据绑定使用Mustache语法（双大括号）将变量包起来。内容{{message}}//index.jsPage({data:{message:'HelloMINA!'}})组件属性（需要在双引号之内）//index.jsPage({data:{id:0}})控制属性(需
Kotoba209_·2020-08-09 18:50

微信小程序学习笔记1 ——关于微信小程序云开发登录注册功能

本科课程作业写了个基础的小程序在这里记录分享一下，如有错误欢迎指出。注册功能的实现注册功能，本质上是向数据库里添加一条用户的信息，我的思路是首先判断该用户有没有注册过账号，若有则跳转登录，若无则直接注册。根据云开发自带的login云函数获取到用户的openid，然后根据此openid在用户集合中查询，为空跳转注册，不为空则跳转提示“已经注册请直接登录”js代码现在登录的js文件开头申明：const
jiaoooooo·2020-08-09 08:58

微信小程序学习（四）：微信小程序连接云数据库

微信小程序学习（四）：微信小程序连接云数据库我今天就只是初步的连接了数据库，我就说一下我的基础代码，和我整了好久才整完的问题这里有个初始化，非常重要！非常重要！非常重要！！！
HOLD ON!·2020-08-09 07:19

微信小程序学习：动画实现幻灯片播放照片效果

前言部分目前市面上小程序越来越多，微信，支付宝，头条都推出了自己的小程序，但是由于微信小程序是最开始的，小程序刚出的时候我也了解过，当时写了个demo也写了一个小的新闻客户端，当时觉得小程序还是有点弱，所以后来就没在关注过小程序的发展，现在随着小程序的崛起（微信说线上小程序超过100万个了），这次下决心好好熟悉一下小程序的开发流程，可能不能全部都熟悉到，所以看到哪里就写到哪里吧。常规操作，来图镇楼
鲨鱼不会飞·2020-08-08 21:45

微信小程序学习（一）：初步使用-实现底部菜单栏；轮播图；下拉框

微信小程序学习（一）：初步使用因为是第一次用这个东西，在看了一部分模板和代码进行学习一、底部菜单栏先进行底部菜单栏设置，在app.json中进行配置"tabBar":{"color":"#a9b7b7"
我血条子呢·2020-08-07 22:01

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

onLaunch(options)：调用时机：小程序被加载完毕的时候调用。这个方法一般用来做一些初始化的事情。比如获取用户信息、获取历史缓存信息、获取小程序打开来源等。参数：|参数|类型|说明||:—|:—|:—||path|String|打开小程序的路径||query|Object|打开小程序的query||scene|Number|打开小程序的场景值||shareTicket|String|s
润森·2020-08-07 21:33

微信小程序学习笔记——模板语法

1.数据绑定https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/data.html在vscode中安装了小程序插件代码示例2.运算（表达式）3.列表渲染①列表循环{{item.name}}{{index}}①对象循环属性：{{key}}值：{{value}}4.block【①占位符的标签】【②写代码的时候可以看到这便签存在
有蝉·2020-08-07 17:28

微信小程序学习笔记（三）

数据文件处理打包（脚本模拟数据库）脚本文件输出module.exports()脚本文件引入require()脚本文件使用template模板化关于import数据文件处理打包（脚本模拟数据库）脚本文件输出module.exports()把数据做成数组单独新建文件夹和新建js文件，把数组放到里面定义出口module.exports={}脚本文件引入require()require()只能使用相对路径
非黑非白-·2020-08-07 12:00

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

微信小程序的入门学习和基本使用前言：最近学习了微信小程序，归纳总结笔记，只是简单的去介绍使用流程，可以作为快速上手的基本过程，学习过程遇到的问题会单独拎出来单独归纳，这篇文章只是代表总结的一个梳理过程。一、简介与发展历史简介：小程序是一种全新的连接用户与服务器的方式，他可以在微信内被便捷的获取和传播，同时具有出色的使用体验。也是一种不需要下载安装即可使用的应用，它实现了应用"触手可及"的梦想，用户
I'm getting stronger·2020-08-07 10:28

微信小程序学习笔记

1.问题：做项目的时候，点击input标签很难获取到焦点进行输入解决办法：鼠标长按即可2.问题：wx.navigateTo页面不跳转原因：我想要跳转到的目标页面含有tabBar底部菜单栏解决办法：将wx.navigateTo换成wx.switchTab3.问题：怎样限制显示文字的长度，超出长度显示省略号解决办法：CSS设置text-indent:2em;/*首行缩进*/overflow:hidde
扎哈的信徒·2020-08-05 20:42

微信小程序学习笔记-2.1 wx.for 和 wx.if 的使用

2018/6/30wx:for和wx:if可以很方便的创建wxml元素本例将用swiper内对象的创建来展示其效果1.前期准备首先创建目录和工程文件mainmain.js中，创建静态listdata:{testList:[{name:"测试1",element:"测试1的相关内容",isHighLighted:true,id:1},{name:"测试2",element:"测试2的相关内容",is
Tony 赵·2020-08-04 21:09

微信小程序学习笔记三（持续更新）---小程序组件通信

参照这里这里将重要的点贴一下：一、项目目录结构在项目同级目录新建components文件夹，新建component会生成wxml,wxss,js,json文件。将所有的公共组件都写在此文件夹下。二、组件引入和使用我们的所有页面一般写在pages目录下，每个页面有wxml,wxss,js,json四个文件，在需要使用组件的页面.json文件中，引入{"usingComponents":{"compo
super琪·2020-08-04 17:11

微信小程序学习笔记四（持续更新）---征服scroll-view下拉刷新

贴图大概实现这种使用swiper做tab切换，数据页面下拉刷新的效果。官方提供的scroll-view作为容器，如果在scroll-view使用onPullDownRefresh实现下拉刷新，会存在页面刷新卡，并且刷新会出现在tab之上，用户体验极差。这里先来一波参考文档：scroll-view微信官方文档scroll-view下拉组件—来自其他大神自己封装的组件，强推！实现思路还是scroll-
super琪·2020-08-04 17:11

微信小程序学习笔记五（持续更新）---上传文件

项目中需要用户上传图片，需要实现，上传按钮默认为一个，在上传一张图片之后，自动增加一个上传按钮，上传三张图片后按钮消失。实现思路：1、图片路径存储在一个数组中，增加和删除图片是对数组进行操作；2、仅一个按钮，添加计数器，num=1;当num==3时，设置按钮隐藏。直接上代码：.wxml文件：+添加图片.wxss代码：.uploader{position:relative;width:175rpx;
super琪·2020-08-04 11:23

微信小程序学习之零碎记录＋写项目时的一些小错误~

6.5微信小程序学习小碎片碎碎念~1.框架1.1全局配置1.2页面配置2.组件2.1视图容器3.6-17写项目遇到的一些错误错误1(Vue中eslint语法限制问题)错误2错误3(跳转和tabbar不能一起用
CSDN_GMC·2020-08-02 15:59

微信小程序学习笔记(4) -- 页面间的跳转和传值

文章目录页面间跳转页面间跳转---导航页面间传值页面导航模式--redirect改进：使用redirect方式跳转导航元素点击高亮如果设置不高亮？如何自定义高亮效果普通元素如何设置高亮页面导航apiwx.navigateTo携带参数wx.redirectTowx.navigateBack页面间跳转页面间跳转—导航关键标签:navigator首先注意2个地方:1.在app.json中书写一个配置项，
怒放de生命2010·2020-08-02 12:27

微信小程序学习笔记

视图层WXML数据绑定Mustache语法（双大括号）中变量不存在时不会报错~Mustache语法（双大括号）中字符串运算用+Mustache语法（双大括号）中变量不用加引号，加了会当成字符串Mustache语法（双大括号）中对象写法：object.key或者object[‘key’]会解析成false，不要直接写checked=“false”，其计算结果是一个字符串，转成boolean类型后代表
Karagrade·2020-08-01 11:35

微信小程序学习笔记一（基础知识 ）

由于最近学习了有关微信小程序的相关知识，故在这里总结一下学习心得。微信小程序开发基础1.登录微信公众平台https://mp.weixin.qq.com/注册小程序账号。2.下载并安装微信web开发者工具Json配置文件配置文件分为两类。app.json为全局配置。作用域：作用于全部页面pages目录下的每个页面下也有一个.json文件，作用域：只作用于当前页面。下面来介绍一下app.json的相
wss5·2020-08-01 05:14

微信小程序学习

最近工作正好有闲暇时间，根据公司安排先前期学习调研一下“微信小程序”，以供后期解决相关的运营需求，而本篇文章就是我对此次学习的一次总结。什么是小程序？如何全面具体的学习？注册与新建小程序认识开发工具目录结构与代码构成JSON配置文件WXML模版文件WXSS样式文件JS脚本文件小程序的执行流程小程序知识体系导图小程序开发的重要说明WXSS模版语法自定义模版数据绑定事件处理自定义组件行为-Behavi
你狗·2020-08-01 03:30

微信小程序学习笔记(二):wxml遍历显示json数据

data=[{'place':'北京','id':0},{'place':'陕西','id':1},{'place':'上海','id':2},{'place':'湖北','id':3},{'place':'江苏','id':4},{'place':'辽宁','id':5},{'place':'山东','id':6},{'place':'四川','id':7},{'place':'广东','id'
菜鸟上路_lbz·2020-07-31 23:27

微信小程序学习笔记——样式 WXSS 【尺寸单位，样式导入，使用less或sass】

目录1.尺寸单位2.样式导入3.选择器4.小程序中使用less（sass也是一样的）1.尺寸单位rpx(responsivepixel):可以根据屏幕宽度进行自适应，规定屏幕宽韦750rpx。如在iphone6上，屏幕宽度为375px,共有750个物理像素，则750rpx=375px=750物理像素，1rpx=0.5px=1物理像素。需求如下/*pages/stylePage/stylePage.
有蝉·2020-07-31 22:59

微信小程序学习——tabBar

tabBar如果小程序是一个多tab应用（客户端窗口的底部或顶部有tab栏可以切换页面），可以通过tabBar配置项指定tab栏的表现，以及tab切换时显示的对应页面。属性类型必填默认值描述最低版本colorHexColor是tab上的文字默认颜色，仅支持十六进制颜色selectedColorHexColor是tab上的文字选中时的颜色，仅支持十六进制颜色backgroundColorHexCol
前端小小小学生·2020-07-31 22:28

微信小程序学习笔记1

微信小程序：QuickStart一、.json后缀的JSON配置文件.json分小程序配置app.json、工具配置project.config.json和页面配置page。json下面分别说一下：1、app.jsonapp.json是对当前小程序的全局配置，包括了小程序的页面路径（pages）、界面表现window、网络超时时间networkTimeout、底部tab等pages接受一个数组，每
～轻舟～·2020-07-31 22:09

微信小程序学习笔记（五）----实现单列下拉菜单

接下来我想做的是一个下拉菜单用来分类的，但是在网上搜了一下，基本上全都是比较复杂的分类菜单，最简单的也是分三列的下拉菜单，但是并不想要这么复杂的，最后找了一个三列的，改成了单列。也把代码尽可能的简单化了。实现的效果图：合并状态：下拉状态：首先下面是目录结构：下面是实现的具体代码：.wxml{{start}}{{item.name}}.wxss.product-list{width:100%;box
胡晓天o0·2020-07-31 21:23

微信小程序学习(八)——微信小程序内联H5页面——web-view组件

web-view组件简单使用1.web-wiew官方文档2.使用web-view组件，需要在微信公众平台配置好业务域名，下载校验文件放在服务器中，确保能通过域名/文件.txt进行访问3.建议新建一个页面，里面只有web-view组件官方文档：承载网页的容器。会自动铺满整个小程序页面，个人类型的小程序暂不支持使用。pages/baidu/baidu.wxml4.链接到web-view页面pages/
iChangebaobao·2020-07-31 18:36

微信小程序学习-动态获取组件宽高

记录下自己踩的坑。。。具体情况是做的小程序需要实现个功能就是有一个导航栏，点击导航栏能跳转到下方scroll-view中的对应位置实现方法是利用query具体参考这篇文章：https://www.cnblogs.com/zjjDaily/p/9566234.html然后遇到的一个问题是计算出来的节点高度不对。。。问题就是上文结尾说的小程序的生命周期问题。。。由于是异步的执行所以很可能你请求的数据还
hjsss3·2020-07-31 18:25

9、微信小程序学习: wepy-com-toast的使用

小程序中并不能像H5一样直接使用alert弹出消息提示，因此可以选择使用wx.showToast的API进行消息提示，但是官方只支持success和loading两种样式。重新写一个toast组件成本略高，因此考虑直接使用现成的wepy-com-toast组件。使用方法如下：1.安装组件npminstallwepy-com-toast--save2.无缓存编译wepybuild--no-cache
Robert火山·2020-07-31 12:33

20161124微信小程序学习笔记-API 学习

API发起请求wx.request({url:'test.php',data:{x:'',y:''},header:{'content-type':'application/json'},success:function(res){console.log(res.data)}})***一个小程序一次最多只能发起5次请求***上传和下载wx.chooseImage({success:function
局部方法·2020-07-29 03:40
上一页 1 2 3 4 5 6 7 8 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他