学习小程序记录

学习小程序记录:
小程序全局配置:
app.json中配置相关信息:
1.pages:配置页面路径表
2.window:配置全局的窗口属性
3.tabBar:配置底部导航栏
页面配置和全局配置基本差不多,页面配置会覆盖全局配置中的属性。

页面生命钩子函数:

Page({

  /**
   * 页面的初始数据
   */
  data: {
    
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

setData:小程序中通过this.setData({键:值})来修改data中数据并执行视图层渲染

标签:
view:相当于html的div标签使用
swiper:轮播图标签可配置轮播属性
icon:字体图标标签
text:文本标签
navigator:导航标签,配置open-type属性有不同的效果

自定义组件:
component文件夹中创建一个组件,创建的组件类似于页面,自定义组件拥有自己的 wxml 模板和 wxss 样式,在组件模板中可以提供一个 用来创建添加内容,
在这里插入图片描述
组件的js文件中Component构造器可用于定义组件,在自定义组件的 js 文件中,需要使用 Component() 来注册组件,并提供组件的属性定义、内部数据和自定义方法。
在这里插入图片描述
组件中修改数据也是通过this.setData来修改数据并执行视图层渲染
使用已注册自定义组件要在父页面的 json 文件中进行引用声明。需要提供每个自定义组件的标签名和对应的自定义组件文件路径:
在这里插入图片描述
页面使用组件:
在这里插入图片描述

父组件传值给子组件:
通过子组件中Component构造器中properties对象创建数据进行传值
在这里插入图片描述
也可在js文件中创建变量来使用:

在这里插入图片描述在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值