微信小程序教程笔记6

微信小程序的页面周期和参数绑定

<!--index.wxml-->
<view class="container">
<navigator url="../logs/logs?id=100" redirect><view><!--<view bindtap="click1">--> <text class="user-motto">文章1</text></view>
</navigator><view><text class="user-motto">文章2</text></view><view><text class="user-motto">文章2</text></view><view><text class="user-motto">文章4</text></view>
</view>

//index.js
Page({/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {console.log("--index page OnLoad--");},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {console.log("--index page OnReady--");},/*** 生命周期函数--监听页面显示*/onShow: function () {console.log("--index page Onshow--");},/*** 生命周期函数--监听页面隐藏*/onHide: function () {console.log("--index page OnHide--");},/*** 生命周期函数--监听页面卸载*/onUnload: function () {console.log("--index page OnUnLoad--");},/*** click1 event handle*/click1:function(){wx.navigateTo({url: '../logs/logs?id=1',})},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

<!--logs.wxml-->
<view class="container log-list">这里使文章详细内容...当前的文章id为：{{articleId}}
</view>

//logs.js
Page({/*** 页面的初始数据*/data: {articleId:null},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {console.log("--logs page OnLoad--");console.log(options)this.setData({articleId:options.id})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {console.log("--logs page OnReady--");},/*** 生命周期函数--监听页面显示*/onShow: function () {console.log("--logs page Onshow--");},/*** 生命周期函数--监听页面隐藏*/onHide: function () {console.log("--logs page OnHide--");},/*** 生命周期函数--监听页面卸载*/onUnload: function () {console.log("--logs page OnUnLoad--");},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

微信小程序教程笔记6相关推荐

微信小程序开发笔记一
微信小程序开发笔记一.微信小程序的结构 1.初识小程序 2.快捷键 3.查阅文档二.常用组件 1.input组件 2.button组件三.小程序中的函数 1.函数的两种定义方法 2.带参函数 3 ...
微信小程序开发-笔记
一.开发文件结构 1.根目录下有三个文件:app.js,app.json和app.wxss.一个小程序项目必须有的三个描述App的文件.这三个文件是应用程序级别的文件.这3个文件的意义: 表1.1 ...
一个C#程序员学习微信小程序的笔记
一个C#程序员学习微信小程序的笔记客户端打开小程序的时候,就将代码包下载到本地进行解析,首先找到了根目录的 app.json ,知道了小程序的所有页面. 在这个Index页面就是我们的首页,客户端在 ...
小程序 pagescrollto_微信小程序学习笔记（三）-- 首页及详情页开发
一.常用组件在上一个章节中讲解了封装请求数据的模块,在此处请求轮播图的数据 1.首页轮播图数据的请求以及渲染 1.1 轮播图数据的请求 pages/home/home.js import 2 使用组 ...
云开发（微信-小程序）笔记（十四）---- 收藏，点赞（上）
云开发(微信-小程序)笔记(十三)---- 注册登陆 1.简介点赞,收藏等都是程序的最简单的功能,在现实的应用中也很常见.这里我就来给大家介绍一下小程序的这个功能. 图标下载地址先去网站上http ...
微信小程序PHP注册,微信小程序教程之注册页面
微信小程序――Page Page()函数用来注册一个页面.接受一个object参数,其指定页面的初始数据.生命周期函数.事件处理函数等. object参数说明: 属性类型描述 data Objec ...
微信小程序开发笔记，你收藏了吗？
** 微信小程序开发笔记,你收藏了吗? ** 最近在开发微信小程序,把自己在项目中经常遇到的知识点记录下来,以便下次开发的时候查看. 开发小程序开发工具推荐vscode写代码,微信开发工具用于查看效果 ...
微信小程序开发笔记进阶篇④——getPhoneNumber 获取用户手机号码（小程序云）
文章目录一.前言二.前端代码wxml 三.前端代码js 四.云函数五.程序流程一.前言微信小程序开发笔记--导读大部分微信小程序开发者都会有这样的需求:获取小程序用户的手机号码. 但是,因 ...
微信小程序开发笔记进阶篇⑤——getPhoneNumber 获取用户手机号码（基础库 2.21.2 之前）
文章目录一.前言二.前端代码wxml 三.前端代码js 四.后端java 五.程序流程六.参考一.前言微信小程序开发笔记--导读大部分微信小程序开发者都会有这样的需求:获取小程序用户的手机 ...
微信小程序学习笔记（1）
微信小程序学习笔记 1.小程序代码结构 2.逻辑层和视图层 3. 小程序的宿主环境(通信模型.运行机制.组件.API) 4. 数据绑定和事件绑定 1.小程序代码结构当开发者新建一个工程时,项目文件包 ...

微信小程序教程笔记6

微信小程序的页面周期和参数绑定

微信小程序教程笔记6相关推荐

最新文章

热门文章