关于微信小程序的入门级详细教程

微信小程序中路由跳转的方式有哪些？区别？

wx.navigateTo(Object)
用于保留当前页面、跳转到应用内的某个页面，使用 wx.navigateBack可以返回到原页面
对于页面不是特别多的小程序，通常推荐使用 wx.navigateTo进行跳转， 以便返回原页面，以提高加载速度。当页面特别多时，则不推荐使用

wx.redirectTo(Object)
重定向，当页面过多时，被保留页面会挤占微信分配给小程序的内存，或是达到微信所限制的 10 层页面栈的情况下，我们应该考虑选择 wx.redirectTo
wx.redirectTo()用于关闭当前页面，跳转到应用内的某个页面
这样的跳转，可以避免跳转前页面占据运行内存，但返回时页面需要重新加载，增加了返回页面的显示时间

wx.switchTab(Object)
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面

wx.navigateBack(Object)
用于关闭当前页面，并返回上一页面或多级页面，开发者可通过 getCurrentPages() 获取当前的页面栈，决定需要返回几层则设置对象的delta属性即可

wx.reLaunch(Object)
关闭所有页面，打开到应用内的某个页面，返回的时候跳到首页

总结

navigateTo 保留当前页面，跳转到应用内的某个页面，使用 wx.navigateBack 可以返回到原页
 redirectTo 关闭当前页面，跳转到应用内的某个页面
 switchTab 跳转到 tabBar 页面，同时关闭其他非tabBar 页面
 navigateBack 返回上一页面
 reLanch 关闭所有页面，打开到应用内的某个页面

关于页面的堆和栈

• avigateTo 新页面入栈
• redirectTo 当前页面出栈，新页面入栈
• navigateBack 页面不断出栈，直到目标返回页，新页面入栈
• switchTab 页面全部出栈，只留下新的 Tab 页面
• reLanch 页面全部出栈，只留下新的页面

小程序怎么实现下拉刷新

方案 一 ：
通过在 app.json 中， 将 “enablePullDownRefresh”: true, 开启全局下拉刷新。
或者通过在 组件 .json ， 将 “enablePullDownRefresh”: true, 单组件下拉刷新。
方案二：
scroll-view ： 使用该滚动组件 自定义刷新，通过 bindscrolltoupper 属性， 当滚动到顶部/左边，会触发 scrolltoupper事件，所以我们可以利用这个属性，来实现下拉刷新功能。

bindtap 和 catchtap 区别

相同点： 都是点击事件
不同点： bindtap 不会阻止冒泡， catchtap 可以阻止冒泡。

小程序有哪些传递数据的方法

使用全局变量
在 app.js 中的 this.globalData = { } 中放入要存储的数据。
在 组件.js 中， 头部 引入 const app = getApp(); 获取到全局变量
直接使用 app.globalData.key 来进行赋值和获取值。
使用 路由
wx.navigateTo 和 wx.redirectTo 时，可以通过在 url 后 拼接 + 变量， 然后在 目标页面 通过在 onLoad 周期中，通过参数来获取传递过来的值。
使用本地缓存

小程序 wx:if 和 hidden 的区别

wx:if : 有更高的切换消耗。
hidden : 有更高的初始渲染消耗。

使用场景：
频繁切换使用 hidden, 运行时条件变化使用 wx: if

如何封装小程序请求

封装 wx.request 请求传递需要的参数( url , data , method , success 成功回调 ， fail 失败回调 ) , 封装常用方法 POST , GET , DELETE , PUT … 最后导出这些方法
然后新建一个 api.js 文件，导入封装好的方法，然后调取相应的方法，传递数据。

封装wx.request

var app = getApp(); //获取小程序全局唯一app实例
var host = '******************'; //接口地址
 

 
//POST请求
function post(url, data, success,fail) {
  request(url, postData, "POST", doSuccess, doFail);
}
 
//GET请求
function get(url, data, success, fail) {
  request(url, postData, "GET", doSuccess, doFail);
}
 
function request(url, data, method, success, fail) {
  wx.showLoading({
    title: "正在加载中...",
  })
  wx.request({
    url: host + url, //请求地址
    method: method, //请求方法
    header: { //请求头
      "Content-Type": "application/json;charset=UTF-8"
    },
    data: data, //请求参数    
    dataType: 'json', //返回数据格式
    responseType: 'text', //响应的数据类型
    success: function(res) {
      wx.hideLoading();
      //成功执行方法，参数值为res.data,直接将返回的数据传入
      success(res.data);
    },
    fail: function() {
      //失败执行方法
      fail();
    },
  })
}
module.exports = {
  postRequest: post,
  getRequest: get,
}

使用封装的wx.request发送请求

var http = require('../../utils/request.js'); //相对路径


var params = {//请求参数
  id:this.data.userId
}
http.postRequest("user/delUser", params, function(res) {
  console.log("修改成功！");
  
}, function(res) {
  console.log("修改失败！！！")
})