Codaland 斜杠国度

Code changes everything. Easier than you think.

随笔分类 -  微信小程序

【WeChat 小程序】009 - 页面跳转以及自定义数据属性
摘要：页面跳转 常见的页面跳转函数如下 路由方式 对于路由的触发方式以及页面生命周期函数如下： 路由方式 触发时机 路由前页面 路由后页面 初始化 小程序打开的第一个页面 onLoad, onShow 打开新页面 调用 API wx.navigateTo 使用组件 onHide onLoad, onSho 阅读全文
posted @ 2020-04-09 21:27 Codaland-斜杠国度 阅读(357) 评论(0) 推荐(0)
【WeChat 小程序】008 - 事件机制
摘要：事件绑定 1.通过bind方式对按钮绑定 2.通过catch方式对按钮绑定 冒泡事件与非冒泡事件 事件分为冒泡事件和非冒泡事件： 1.冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。 2.非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。 WXML的冒泡事件列表： 类型 触 阅读全文
posted @ 2020-04-09 20:48 Codaland-斜杠国度 阅读(184) 评论(0) 推荐(0)
【WeChat 小程序】007 - 按钮设置以及页面的生命周期函数
摘要：按钮设置 1. 使用text元素显示出按钮并绑定点击事件处理函数f0 通过设置text元素的bindtap属性绑定函数 示例代码（wxml）： 2. 规定按钮的样式 示例代码（wxss）： 事件处理函数 1. 在 页面逻辑文件 中的Page函数中设置 页面生命周期函数 可以理解为是一种特殊的事件处理 阅读全文
posted @ 2020-04-04 16:48 Codaland-斜杠国度 阅读(248) 评论(0) 推荐(0)
【WeChat 小程序】006 - 使用swiper组件实现幻灯片轮播
摘要：swiper元素 滑动容器 1. 代码格式（wxml） 2. 样式优化 开启页面提示小圆点 提供相邻页的预览 通过设置 previous margin 和 next margin 属性 示例代码： 设置默认幻灯片页 通过设置 current 属性 阅读全文
posted @ 2020-04-04 15:50 Codaland-斜杠国度 阅读(391) 评论(0) 推荐(0)
【WeChat 小程序】005 - 条件渲染以及列表渲染
摘要：条件渲染 1. 概念： 只有当条件成立时才渲染生成 2.wx:if属性的设置 示例代码： 注：只有 当thisWeekMovie.isHighlyRecommended为真 时，界面元素才会被渲染 类似的：使用hidden属性也可以实现类似的效果，但元素总是会被生成，增大初始化开销 列表渲染（循环渲 阅读全文
posted @ 2020-04-03 22:39 Codaland-斜杠国度 阅读(192) 评论(0) 推荐(0)
【WeChat 小程序】004 - 数据类型以及数据绑定
摘要：数据类型 1. 静态数据 在小程序编写时就已经确定的数据，直接在wxml中编辑。 2. 动态数据 需要在小程序运行的过程中，动态的从服务器端获取，在渲染输出到视图中显示的数据。 处理动态数据 1. 传统方式：DOM API 缺陷： 每次要更新数据时，都需要执行视图更新的代码； 代码维护困难，代码与页 阅读全文
posted @ 2020-04-02 19:50 Codaland-斜杠国度 阅读(202) 评论(0) 推荐(0)
【WeChat 小程序】003 - 底部导航栏tabBar的设置以及顶部导航栏的设置
摘要：底部导航栏tabBar tabBar的本质 对若干 一级页面 的入口链接 tabBar的配置 1. 准备导航栏所需要的图标，并放置于根目录名为icons的文件夹中； 2. 在 全区配置文件app.json 中增添"tabBar"属性 示例代码： 注：{ }括起来的是对象，[ ]是对象数组 3. 配置 阅读全文
posted @ 2020-04-02 19:33 Codaland-斜杠国度 阅读(397) 评论(0) 推荐(0)
【WeChat 小程序】002 - view、text、image组件以及弹性盒子的概念
摘要：View、Text、Image组件 View 1. 示例代码 2. view控件属性： class="" 样式类 Text 1. 示例代码 2. text控件属性： class="" 样式类 font size="" 字体大小 单位可以为px或者rpx，有关rpx后面会提到 font weight= 阅读全文
posted @ 2020-03-31 22:21 Codaland-斜杠国度 阅读(265) 评论(0) 推荐(0)
【WeChat 小程序】001 - 项目目录文件结构以及基本配置
摘要：文件结构 1. 根目录 app.js 程序主逻辑 app.json 全局配置文件 需要在"pages"属性中以 相对路径 的方式声明页面 app.wxss 全局样式文件 这里设置一些所有页面都可能用到的公共样式类 project.config.json 程序信息 该文件由开发工具自动生成 pages 阅读全文
posted @ 2020-03-31 21:47 Codaland-斜杠国度 阅读(350) 评论(0) 推荐(0)