![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
jianning-wu
努力过,期待中,好好工作!
展开
-
微信小程序之逻辑层(JS)路由+模块化+API详解
本章节按照微信文档讲述 红色框里的内容 一.路由 页面路由在小程序中所有页面的路由全部由框架进行管理。 1.页面栈 getCurrentPages()getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。 注意: 1.不要尝试修改页面栈,会导致路由以及...原创 2017-06-05 10:58:52 · 4908 阅读 · 0 评论 -
微信小程序之基础内容之icon(图标)+text(文本)+progress(进度条)+rich-text(富文本)详解
一.icon icon 即 图标。 1.属性 2.代码 2.1.WXML代码<view class="group"> <block wx:for="{{iconSize}}"> <icon type="success" size="{{item}}"/> </block原创 2018-10-09 14:29:30 · 11531 阅读 · 0 评论 -
微信小程序之表单组件之slider(滑动选择器)+form(表单)+label(表单组件)详解
一.slider slider 即 滑动选择器。 1.属性 2.代码 2.1.WXSS代码.intro { margin: 10px;} 2.2.WXML代码<text class="intro">{{textValue}}</text><view class="intro"> <...原创 2018-10-09 11:27:31 · 6011 阅读 · 0 评论 -
微信小程序之表单组件之picker-view(滚动选择器)+picker(滚动选择器)详解
一.picker-view picker-view 即 嵌入页面的滚动选择器。 1.属性 2.代码 2.1.WXSS代码.intro { margin: 30px; text-align: center;} 2.2.WXML代码<view> <view>{{year}}年{{month}}月{{day}}...原创 2018-10-09 10:45:08 · 21317 阅读 · 2 评论 -
微信小程序之表单组件之input(输入框)+textarea(多行输入框)+radio(单选项目)详解
一.input input 即 输入框。该组件是原生组件,使用时请注意相关限制。 1.属性 type 有效值 confirm-type 有效值 2.代码https://developers.weixin.qq.com/miniprogram/dev/component/input.html 二.textar...原创 2018-10-08 15:55:59 · 36540 阅读 · 0 评论 -
微信小程序之表单组件之switch(开关选择器)+button(按钮)+checkbox(多项选择器)详解
一.switch switch 即 开关选择器。 1.属性 2.代码 2.1.WXSS代码.body-view { margin-top: 10px}.switch-view { margin-left: 5px}.class-view { margin-top: 30px} 2.2.WXML代码&...原创 2018-10-08 11:33:30 · 9682 阅读 · 0 评论 -
微信小程序之开发细节(一)
1.微信小程序 下拉刷新问题 单个页面配置 单个页面的JSON文件{ "navigationBarTitleText": "新闻", "enablePullDownRefresh": true} 全局配置 全局的JSON文件"window":{ "backgroundTextStyle": "light", "naviga原创 2018-10-11 15:33:14 · 752 阅读 · 0 评论 -
微信小程序之逻辑层(JS)注册程序+场景值详解
本章节按照微信文档讲述 红色框里的内容 一.注册程序 App(Object)App() 函数用来注册一个小程序。接受一个 Object 参数,其指定小程序的生命周期回调等。App() 必须在 app.js 中调用,必须调用且只能调用一次。不然会出现无法预期的后果。前台、后台定义: 当用户点击左上角关闭,或者按了设备 Home 键离开微信,小程序并没有直接销毁,而...原创 2017-05-14 14:22:24 · 421 阅读 · 0 评论 -
微信小程序之基础组件之视图容器之swiper(滑块视图容器)详解
swiper:即 滑块视图容器。 1.属性 2.代码 2.1.WXSS代码@import "/lib/weui.wxss";page { background-color: #F8F8F8; height: 100%; font-size: 32rpx; line-height: 1.6;}.page-body{ ...原创 2017-09-20 18:03:46 · 802 阅读 · 0 评论 -
微信小程序之逻辑层(JS)注册页面(初始化数据+生命周期回调函数+页面事件处理函数+组件事件处理函数)详解
本章节按照微信文档讲述 红色框里的内容 一.初始化数据 1.页面 Page 1.1.说明Page(Object)Page(Object) 函数用来注册一个页面。接受一个 Object 类型参数,其指定页面的初始数据、生命周期回调、事件处理函数等。Object 内容在页面加载时会进行一次深拷贝,需考虑数据大小对页面加载的开销。 1.2.代码P...原创 2017-05-27 15:19:36 · 2574 阅读 · 0 评论 -
微信小程序之基础组件之视图容器之scroll-view详解
基础组件 之 视图容器 之 scroll-view 详解 1.概述scroll-view即可滚动视图区域。 使用竖向滚动时,需要给<scroll-view/>一个固定高度,通过 WXSS 设置 height。 ...原创 2017-07-26 18:05:14 · 662 阅读 · 0 评论 -
微信小程序之基础组件之视图容器之view详解
基础组件 之 视图容器 之 view 详解 1.概述view即视图容器。 2.代码 2.1.WXSS代码view { margin: 20px;}button { margin: 20px;}.viewposition { text-align: center;} 2.2.WXML代码<view class=...原创 2017-07-21 15:24:00 · 1261 阅读 · 0 评论 -
微信小程序之CSS操作字体
1.字体大小属性:font-size 取值: 代码:wxss代码:.view_normal_css { width: 100px; height: 50px; margin: 10px; font-size:smaller;}wxml代码:<view class="view_normal_css">字体大小</vi...原创 2017-04-21 17:29:09 · 4091 阅读 · 0 评论 -
微信小程序之页面四个文件详解以及跳转事件
1.每个页面需要四个文件 1.1.JS文件 必须 页面逻辑,相当于Android中的Activity或是Fragment。 1.2.WXML文件 必须 页面结构,相当于Android中的xml布局。 1.3.JSON文件 不必须 页面配置,相当于 Android中的String配置View的显示文字。 1.4.WXSS...原创 2017-04-21 11:26:53 · 1556 阅读 · 0 评论 -
微信小程序之基础组件详解
基础组件 1.概述1.1.组件是视图层的基本组成单元。1.2.组件自带一些功能与微信风格一致的样式。1.3.一个组件通常包括 开始标签 和 结束标签,属性 用来修饰这个组件,内容 在两个标签之内。 代码<tagname property="value">Content goes here ...</tagname> 注意:...原创 2017-07-21 14:36:45 · 676 阅读 · 0 评论 -
微信小程序之WXSS详解
WXSS详解 1.概述WXSS(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式。WXSS 用来决定 WXML 的组件应该怎么显示。为了适应广大的前端开发者,WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序,WXSS 对 CSS 进行了扩充以及修改。与 CSS 相比,WXSS 扩展的特性有 尺寸单位。 样...原创 2017-06-10 13:42:46 · 3965 阅读 · 0 评论 -
微信小程序之从零开始到创建第一个小程序Demo
从零开始到创建第一个小程序Demo。 一.注册+登录+完善信息+获取AppID+安装开发工具+创建项目 1.注册账号(链接:https://mp.weixin.qq.com/) 2.登录账号第一次登录成功后的页面 3.填写小程序信息 4.获取AppID(小程序ID) ...原创 2017-04-18 10:46:34 · 3370 阅读 · 0 评论 -
微信小程序之视图层(WXML)数据绑定+列表渲染+条件渲染+模板+事件+引用详解
本章节按照微信文档讲述 红色框里的内容 一.数据绑定 WXML 中的动态数据均来自对应 Page 的 data。 1.简单绑定数据绑定使用 Mustache 语法(双大括号)将变量包起来,可以作用于: 1.1.内容 代码 WXML代码<view> {{ message }} </view> JS代码...原创 2017-06-05 11:00:34 · 12215 阅读 · 1 评论 -
微信小程序之媒体组件之image(图片)+video(视频)详解
一.image image 即 图片。 1.属性 mode 有效值mode 有 13 种模式,其中 4 种是缩放模式,9 种是裁剪模式。 注1:image组件默认宽度300px、高度225px。注2:image组件中二维码/小程序码图片不支持长按识别。仅在wx.previewImage中支持长按识别。 2.代码 2.1...原创 2018-10-09 15:06:01 · 9681 阅读 · 1 评论