weapp-navigate

小程序框架路由跳转方法

• weapp-navigate
  • Features
  • Usage
    • 基础使用
    • 进阶使用
      • 创建自定义hook
  • Options
    • createNavigate
    • navigate
  • License

Features

• promisify 的 api 调用
• 创建拦截器控制路由跳转(用于鉴权等等)
• 多框架统一的 api 管理
• 参数组合

Usage

<npm|yarn|pnpm> i weapp-navigate

基础使用

import { navigate, createNavigate } from 'weapp-navigate'

async function main() {
  // 使用
  await navigate({
    url: '/pages/index/index',
    params: {
      id: '1',
      type: 'add'
    }
  })
  // 相当于
  await wx.navigateTo({
    url: '/pages/index/index?id=1&type=add'
  })

  await navigate({
    type: 'navigateBack'
  })
  // 相当于
  await wx.navigateBack()

  await navigate({
    type: 'reLaunch',
    url: '/pages/index/index'
  })
  // 相当于
  await wx.reLaunch({
    url: '/pages/index/index'
  })
  // 同样还有 redirectTo 和 switchTab
}

进阶使用

创建自定义hook

import { createNavigate } from 'weapp-navigate'

const navigate = createNavigate({
  // 默认情况下使用全局 wx 对象，你可以使用 uni / taro 这种对象
  globalTarget: uni,
  onBeforeExecute: async (options) => {
    // 这里你可以对参数进行修改
    if (options.type === 'navigateTo') {
      options.url = options.url + '54321'
    }
    // 或者你可以使用异步方法，进行远程调用
    const isAuth = await getPermission()
    
    if(isAuth){
      // 在这里抛出错误之后,不会去执行 navigateTo 那些方法，同时这个错误会被 onError 捕获
      throw new Error('no login !')
    }
  },
  onAfterExecute(result) {
    // onAfterExecute 可以对 result 返回值进行修改
    result.errMsg = '111'
    // 同样也可以在这里使用异步方法，或者抛出错误
    // throw new Error('no permission')
  },
  onError(error) {
    console.error(error)
  }
})
const result = await navigate({
  url
})

Options

createNavigate

types

export interface ICreateNavigateOptions {
  globalTarget?: IGlobalTarget
  onError?: (err: Error) => void
  onBeforeExecute?: (options: NavigateOptions) => void | Promise<void>
  onAfterExecute?: (result: CallbackResult) => void | Promise<void>
}

navigate

types

NavigateOptions

License

This project uses the MIT license.