uniapp调转方式整理

1.UNI跳转方法

uni方法进行跳转

uni.navigateTo

保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面

uni.redirectTo

关闭当前页面，跳转到应用内的某个页面

uni.reLaunch

关闭所有页面，打开到应用内的某个页面

uni.switchTab

跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面

uni.navigateBack

关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈，决定需要返回几层

uni.preloadPage

预加载页面，是一种性能优化技术。被预载的页面，在打开时速度更快

2.封装为vue方法

我们可以自己封装为Vue方法，来调用跳转与传参跳转

var utils = {};
//公共处理方法
utils.install = function(Vue, option) {
  // 页面跳转
  Vue.prototype.jump = function(path) {
    uni.navigateTo({
      url: path
    })
  };
  // 返回
  Vue.prototype.back = function(obj) {
  uni.navigateBack(obj);
  };
  // 带参跳转
  Vue.prototype.togo = function(url,data){
    url += (url.indexOf('?') < 0 ? '?' : '&') + param(data)
    uni.navigateTo({  
      url
    }) 
  };
  function param(data) {
    let url = ''
    for (var k in data) {
      let value = data[k] !== undefined ? data[k] : ''
      url += '&' + k + '=' + encodeURIComponent(value)
    }
    return url ? url.substring(1) : ''
  };
  // 获取登录用户
  Vue.prototype.getUserInfo = function() {
  let res = uni.getStorageSync('userInfo');
  if (res) {
    return res
  } else {
    return {}
  }
  };
};


export default utils;

在 main.js 中use一下就可以在页面用了

import utils from './common/util.js'
Vue.use(utils)

携带 userid 跳转到 order 页面

togoOrderList(userid) {
  this.togo('/pagesOther/personal/order',{userId: userid})
}

当然也可以使用uni三方组件进行页面跳转