小程序开发:内置的方法事件 api

本文详细介绍了小程序中的一些核心API,包括获取手机信息、展示交互反馈、实现页面路由以及发起网络请求。通过wx.getSystemInfoSync()获取手机型号,wx.showLoading()显示加载提示,wx.navigateTo()、wx.switchTab()和wx.reLaunch()进行页面跳转。同时,文章还演示了wx.request()进行数据请求的方法。
摘要由CSDN通过智能技术生成

小程序内封装的api包括:数据请求,路由,动画效果,缓存,位置,画布等等;

1. 基础:

获取手机型号,地理位置,权限等一些信息;
点击查看文档详情

console.log(wx.getSystemInfoSync()) // 可以查看都有哪些属性
wx.getSystemInfoSync().model  // 获取手机型号

2.界面

**2.1 交互:**包含消息提示 toast,加载中load,
点击查看文档详情
以wx.showLoading() 为例

onload: function(){
	wx.showLoading({
	  title: '加载中',
	})
	setTimeout(function () { // 数据请求到了以后进行清除
	  wx.hideLoading()
	}, 2000)
}

在这里插入图片描述

3.路由

之前路由都是在 navigator标签内跳转,默认的navigat不能跳转tabber;
使用api进行跳转:

wx.navigateTo({ // 不能跳转 tabber
  url: 'test?id=1',
  events: {
    // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据
    acceptDataFromOpenedPage: function(data) {
      console.log(data)
    },
    someEvent: function(data) {
      console.log(data)
    }
    ...
  },
  success: function(res) {
    // 通过eventChannel向被打开页面传送数据
    res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
  }
})
wx.switchTab({ // 可以跳转 tabber 但是不能传参
  url: '/index'
})
wx.reLaunch({ // 可以跳转 tabber 可以传参
  url: 'test?id=1'
})

4,请求

wx.request({
  url: 'test.php', //仅为示例,并非真实的接口地址
  data: {
    x: '',
    y: ''
  },
  header: {
    'content-type': 'application/json' // 默认值
  },
  success (res) {
    console.log(res.data)
  }
})
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值