vue-taro-router v1.0.3

VueTaroRouter

基本 Taro ，扩展成 vue-router 的使用体验

Installation

npm i vue-taro-router -S

Usage

// router.js
import VueTaroRouter from "vue-taro-router";
const router = new VueTaroRouter();

// 添加拦截器
router
  .beforeEach((to, from, next) => {
    console.log(to);
    console.log(from);
    next();
  })
  .beforeEach((to, from, next) => {
    if (~to.path.indexOf("abc2")) {
      // 在拦截器里重定向
      next({
        path: "/pages/home/index",
        success() {
          console.log("success");
        }
      });
    } else {
      next();
    }
  })
  .afterEach((to, from) => {
    console.log("afterEach:", to);
    console.log("afterEach:", from);
  });

export default router;

// app.js
import Vue from "vue";
import router from "./router.js";

Vue.use(router);

// page.vue
this.$router.push({
  path: "/page/abc2/index",
  query: { id: "123" },
  events: {
    // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
    acceptDataFromOpenedPage: function(data) {
      console.log(data);
    },
    someEvent: function(data) {
      console.log(data);
    }
  },
  complete() {
    // 不论成功失败，都会执行这里
  },
  fail(err) {
    // 失败，执行这里
    console.log(err);
  },
  success: function(res) {
    // 成功，执行这里
    // 通过eventChannel向被打开页面传送数据
    res.eventChannel.emit("acceptDataFromOpenerPage", { data: "test" });
  }
});

Methods

this.$router.push(options);
this.$router.replace(options);
this.$router.goBack(options);
this.$router.relaunch(options);
this.$router.switchTab(options);

// 添加前置拦截器
this.$router.beforeEach(beforeEach);

// 添加后置响应器
this.$router.afterEach(afterEach);

options 路由跳转入参

属性

this.$router.query;
this.$router.path;
this.$router.fullPath;