• Stars
    star
    300
  • Rank 138,870 (Top 3 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 6 years ago
  • Updated over 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

🛴在 mpvue 中使用 vue-router 兼容的路由写法

mpvue-router-patch

在 mpvue 中使用 vue-router 兼容的路由写法

npm package npm downloads

安装

npm i mpvue-router-patch

使用

// main.js
import Vue from 'vue'
import MpvueRouterPatch from 'mpvue-router-patch'

Vue.use(MpvueRouterPatch)

API

支持以下列出的方法及属性

Router 实例

属性

  • $router.app

当前页面的 Vue 实例

  • $router.mode

路由使用的模式,固定值 history

  • $router.currentRoute

当前路由对应的路由信息对象,等价于 $route

方法

  • $router.push(location, onComplete?, onAbort?, onSuccess?)

跳转到应用内的某个页面,mpvue.navigateTompvue.switchTabmpvue.reLaunch 均通过该方法实现,location 参数支持字符串及对象两种形式,跳转至 tabBar 页面或重启至某页面时必须以对象形式传入

// 字符串
router.push('/pages/news/detail')

// 对象
router.push({ path: '/pages/news/detail' })

// 带查询参数,变成 /pages/news/detail?id=1
router.push({ path: '/pages/news/detail', query: { id: 1 } })

// 切换至 tabBar 页面
router.push({ path: '/pages/news/list', isTab: true })

// 重启至某页面,无需指定是否为 tabBar 页面,但 tabBar 页面无法携带参数
router.push({ path: '/pages/news/list', reLaunch: true })
  • $router.replace(location, onComplete?, onAbort?, onSuccess?)

关闭当前页面,跳转到应用内的某个页面,相当于 mpvue.redirectTolocation 参数格式与 $router.push 相似,不支持 isTabreLaunch 属性

  • $router.go(n)

关闭当前页面,返回上一页面或多级页面,n 为回退层数,默认值为 1

  • $router.back()

关闭当前页面,返回上一页面

路由信息对象

属性

  • $route.path

字符串,对应当前路由的路径,总是解析为绝对路径,如 /pages/news/list

  • $route.params

空对象,小程序不支持该属性

  • $route.query

一个 key/value 对象,表示 URL 查询参数。例如,对于路径 /pages/news/detail?id=1,则有 $route.query.id == 1,如果没有查询参数,则是个空对象。

  • $route.hash

空字符串,小程序不支持该属性

  • $route.fullPath

完成解析后的 URL,包含查询参数和 hash 的完整路径

  • $route.name

当前路由的名称,由 path 转化而来

More Repositories

1

vue-simplemde

📝 Vue SimpleMDE - use simplemde with vue.js
Vue
768
star
2

ithome-lite

🥛 IT之家第三方小程序版客户端(使用 mpvue 开发,兼容 web)
Vue
528
star
3

mpvue-entry

⛓️ 集中式页面配置,统一构建入口,支持新增页面热更新
JavaScript
353
star
4

caption2text

📥 PWA 版字幕转换为文本工具,支持 ass 及 srt 格式,可批量导出为 word 及 text 文件
Vue
186
star
5

vue-cli-plugin-qiankun

🚀 qiankun plugin for vue-cli
JavaScript
169
star
6

ChineseBQB-client

🤣 开源表情包小程序
Less
90
star
7

html-i18n-cli

HTML 国际化/翻译 工具
JavaScript
32
star
8

offscreen-canvas-demo

JavaScript
19
star
9

mpvue-packager

🛠 集成构建工具,双端支持
JavaScript
15
star
10

xiaoplayer

xiaomusic 小程序客户端,开源小程序音乐播放器,使用小爱音箱播放本地/NAS音乐
TypeScript
13
star
11

mpvue-config-loader

🏷 单文件页面配置,支持全局组件引用
JavaScript
11
star
12

ncform-maker

🔀 ncform-maker, a very nice visualization way to make ncform schema
JavaScript
7
star
13

unique

🕯 An online shopping platform based on Express & Vue2.
JavaScript
7
star
14

anonchat

👥 基于 web socket 的匿名匹配聊天
Vue
6
star
15

vscode-plugin-ncform-schema

😘 ncform schema editor plugin for vscode
Vue
6
star
16

taobao-edu-spider

🕷淘宝教育视频爬虫,基于Nightmare
JavaScript
5
star
17

vscode-plugin-html-i18n

TypeScript
5
star
18

vue-superagent

⚡A small wrapper for integrating superagent to Vuejs
JavaScript
5
star
19

vod-server

🕯 vod server side
JavaScript
4
star
20

axios-apicloud-adapter

📱 axios 的 apicloud 适配器,以便于在 app 中使用原生网络请求库,避免跨域问题
JavaScript
4
star
21

jsonl-converter

One-Click JSON Lines Converter
TypeScript
3
star
22

cards-ahoy

Cards Ahoy! 小账本,提供实时卡牌价格查询、卡牌盈亏统计及卡组配置分享等功能
TypeScript
2
star
23

vscode-extension-mammoth

Word preview and export extension for vscode.
TypeScript
2
star
24

vod-client

🕯 vod client side
Vue
2
star
25

puppet-spider

🕷 赶集网 Puppeteer 命令行爬虫工具
JavaScript
2
star
26

CasualPlay

✨Some of my small projects
JavaScript
1
star
27

simple-form-binder

JavaScript
1
star
28

university-rankings

油猴脚本,划词查询大学排名
JavaScript
1
star
29

ncform-theme-iview

ncform theme widgets -> iview
Vue
1
star