uni-simple-router 技术文档

uni-simple-router 技术文档

uni-simple-router A simple, lightweight 'uni-app' routing plugin 项目地址: https://gitcode.com/gh_mirrors/un/uni-simple-router

安装指南

要开始使用 uni-simple-router, 你需要首先保证你的 uni-app 项目已经初始化好。接下来，通过以下步骤添加路由器支持：

对于 Vue2 和旧版本 uni-app:

npm install uni-simple-router@latest --save

对于 Vue3 和兼容 Vite 的新项目:

推荐使用 uni-simple-router V3 版本:

npm install uni-simple-router@next --save

或者，如果你偏好 Yarn，可以使用：

yarn add uni-simple-router@next

之后，在项目入口文件或相关配置文件中进行初始化设置。

项目的使用说明

1. 初始化路由器：

   在你的 main.js 文件中，引入并初始化 uni-simple-router。

   import Vue from 'vue'
   import App from './App'
   import router from './router' // 确保你有创建好的 router.js 或 router/index.js 文件
   
   Vue.use(uniSimpleRouter)
   
   new Vue({
     ...App,
     router
   }).$mount()
   

2. 配置路由：

   创建 router.js 或在现有配置中按照以下格式定义路由：

   const routes = [
     {
       path: '/',
       component: () => import('@/pages/Home')
     },
     {
       path: '/about',
       component: () => import('@/pages/About')
     }
     // 添加更多路由...
   ]
   
   export default new uniSimpleRouter(routes)
   

3. 导航与传参：

   使用uni-app内置的 $router.push 方法来进行页面导航，例如：

   this.$router.push({ path: '/about', query: { id: 1 } })
   

   对于动态路由匹配和命名视图等高级功能，参考Vue-router的官方文档以及 uni-simple-router 的特定实现文档。

项目API使用文档

uni-simple-router在遵循Vue-router的基础上提供了特有的或优化过的API，具体API细节建议访问其官方文档站点获取最新、详尽的API列表和使用示例。主要API通常包括但不限于push、replace、go、beforeEach等导航守卫，以及一些专为uni-app定制的功能调用。

项目安装方式 (已包含在安装指南中)

安装方式已在上述“安装指南”部分详细描述，分为Vue2/uni-app的传统项目和适配Vue3的新项目两种情况，通过npm或yarn进行包的安装，并在项目中进行适当配置以启用路由功能。

---

以上内容构成了一篇基本的uni-simple-router技术文档框架，对于深入理解和实践，建议直接访问项目的GitHub页面和官方文档获取更全面的信息和支持。

uni-simple-router A simple, lightweight 'uni-app' routing plugin 项目地址: https://gitcode.com/gh_mirrors/un/uni-simple-router