本篇文章将介绍小程序的基础组件——媒体组件。 媒体组件分为三大组件: audio image video audio<!-- audio.wxml --> <audio poster="{{poster}}" name="{{name}}" author="{{author}}" src="{{src}}" id="myAudio" controls loo ...

本篇文章将介绍小程序的基础组件——导航组件。 导航组件只有一个组件: navigator navigator /** wxss **/ /** 修改默认的navigator点击态 **/ .navigator-hover { color:blue; } /** 自定义其他点击态样式类 **/ .other-navigator-hover { colo ...

本篇文章将介绍小程序的基础组件——表单组件。 表单组件分为11个组件: button checkbox form input label picker——普通选择器，时间选择器，日期选择器，默认是普通选择器 picker-view——嵌入页面的滚动选择器 radio slider——滑动选择器 switch textarea 由于表单提交的组件和很 ...

本篇文章将介绍小程序的基础组件——基础内容。 基础内容分为三大组件: icon——图标 text——文本 progress——进度条 iconicon属性 index.wxml <view class="group"> <block wx:for="{{iconSize}}"> <icon type="success" ...

本篇文章将介绍小程序的基础组件——视图容器。 视图容器分为三大组件: view scroll-view——类似于滚动组件 swiper——类似于图片轮播组件 view首先介绍下view的基本属性。 属性名 类型 默认值 说明 hover Boolean false 是否启用点击态 ...

什么是事件 事件是视图层到逻辑层的通讯方式。 事件可以将用户的行为反馈到逻辑层进行处理。 事件可以绑定在组件上，当达到触发事件，就会执行逻辑层中对应的事件处理函数。 事件对象可以携带额外信息，如 id， dataset， touches。 事件分类事件分为冒泡事件和非冒泡事件： 冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。 非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节 ...

微信小程序是通过什么方法来实现数据绑定的呢？答案是状态模式-单向数据流。 状态模式定义一个对象，改对象可以通过管理其状态的变化，从而实现应用程序做出相应的变化。 状态模式简单的讲，对象状态化，只要对象状态发送变化，就通知页面更新视图元素。 通过以下三个步骤实现： 识别哪个UI元素被绑定了相应的对象。 监视对象状态的变化。 将所有变化传播到绑定的视图上。 注意数据流向是单向的，即视图变化不会影 ...

本篇文章介绍小程序的生命周期，由于小程序分为应用和页面两个部分，所以小程序的生命周期就涉及到三个部分，分别是： 应用的生命周期 页面的生命周期 应用的生命周期对页面生命周期的影响 一、应用的生命周期App() 函数用来注册一个小程序。接受一个 object 参数，其指定小程序的生命周期函数等。object参数说明： 属性 类型 描述 触发时机 onLaunch Function 生命周 ...

万事俱备，现在终于可以愉快的进行小程序的开发了~~有木有鸡冻，内心是不是万马奔腾，跃跃欲试了。 首先本篇文章介绍两点： 1.小程序开发工具的使用 2.微信小程序目录结构 微信小程序开发工具使用介绍下载安装小程序 开发工具： 微信web开发者工具 官方demo下载 安装完成后，打开微信web开发者工具。 1.扫码二维码登录 微信web开发者工具 扫码登录 2.扫码二维码以后，进入添加项目或 ...

如果只是想体验下小程序的开发快感，这一节可以忽略，直接看下一篇文章微信小程序之开发初体验（三）——开发工具使用和目录结构。毕竟不注册也是可以体验小程序的魅力的，注册小程序的作用只是在于你可以获得一个AppID，通过这个AppID可以将小程序发布出去。 无AppID开发入口 话不多说了，下面介绍微信小程序注册的相关内容吧。 小程序的注册范围首先微信小程序的开放注册范围只包括了企业、政府、媒 ...

背景 在PC互联网时代，相信让大家最烦心的事情莫过于经常需要更新电脑客户端，而且每次升级都需要手动安装，对于用户而言，这是极不好的体验。移动互联网浪潮的到来，智能手机不断普及，App越来越多，用户同样面临一样的问题，需要不断的安装更新App，而且占用了大量的稀缺资源——手机的存储空间。针对以上问题提供一种解决方案成为一个迫切的需求。参考PC互联网时代，用浏览器替代电脑客户端应用的思路，同样采用HT ...

微信小程序自定义checkbox样式checkbox .wx-checkbox-input{ width:16px; height:16px; } checkbox .wx-checkbox-input.wx-checkbox-input-checked{ border-color:#e33c2b !important; background:#e33c2b !im ...

微信小程序阻止事件冒泡小程序中子节点阻止事件冒泡到父节点可以采用catchtap替代bindtap来实现。<!--父节点--> <view bindtap="tap1"> <text catchtap="tap2">子节点</text> </view> ...

微信小程序图片空白问题处理wx.getImageInfo({ src: 'https://01.jpg', success: function (res) { console.log(res.path);//得到处理后的本地图片路径 } ...

当我们列表不满一屏幕时候，无法触发onReachBottom方法，我们可以这么操作：height: 100vh;.view-container { display: -webkit-flex; display: flex; justify-content: center; flex-direction: row; flex-wrap: wrap; width: ...