@zf-uni-helper/navigate-to

@zf-uni-helper/navigate-to 是一个用于 UniApp 的导航工具包，旨在简化页面跳转和路径处理。它支持多种路径类型，并允许用户自定义路径规则，以满足特定需求。

特性

• 多种路径类型支持：支持内置页面、WebView 页面、公众号链接、微信小程序、图片、文档等多种跳转路径。
• 自定义路径规则：用户可以通过修改规则轻松扩展或更改路径处理逻辑。

安装

npm install @zf-uni-helper/navigate-to

使用

导入

import { navigateTo } from '@zf-uni-helper/navigate-to';

跳转示例

// 跳转到内部页面
navigateTo('/pages/home/index');

// 跳转到 WebView 页面，默认跳转 /pages/web-view?url=
navigateTo('https://example.com/web-view/index');

// 跳转到公众号主页（公众号微信号）
navigateTo('#公众号://wx-pai');

// 跳转到公众号文章
navigateTo('https://mp.weixin.qq.com/s/qP3U9eYqjdrppvyM5Vq91Q');


// 跳转到微信小程序（小程序短链接或者APPID和具体路径）
navigateTo('#小程序://小程序示例/MhbyFBeUdgeZxQI'); // ShortLink
navigateTo('#小程序://wxe5f52902cf4de896'); // APPID
navigateTo('#小程序://wxe5f52902cf4de896/page/component/index'); // APPID + PATH
navigateTo('weixin://dl/business/?appid=wxe5f52902cf4de896&path=%2Fpage%2Fcomponent%2Findex&query=&env_version=release'); // URL Scheme 明文

// 跳转到视频号主页（视频号ID）
navigateTo('#视频号://sph30BS7NDUWBPg');

// 跳转到腾讯会议
navigateTo('#腾讯会议：123-456-789');
navigateTo('#腾讯会议：123-456-789\n会议密码：123456');
navigateTo('何小勺 邀请您参加腾讯会议\n会议主题：何小勺预定的会议\n会议时间：2025/03/14 10:30-11:00 (GMT+08:00) 中国标准时间 - 北京\n点击链接入会，或添加至会议列表：\nhttps://meeting.tencent.com/dm/SA5Vwm9H6auK\n#腾讯会议：472-248-973\n会议密码：123456\n复制该信息，打开手机腾讯会议即可参与');

// 预览图片
navigateTo('https://example.com/somefile.png'); // 示例 url，并非真实存在

// 预览文档
navigateTo('https://example.com/somefile.pdf'); // 示例 url，并非真实存在

// 拨打电话
navigateTo('tel:1234-5678');
navigateTo('tel:010-1234-5678');
navigateTo('tel:+86-010-1234-5678');

// 调用原生微信小程序API
navigateTo('wx.makePhoneCall({ "phoneNumber": "01012345678" })') // 拨打电话

// 调用原生 UNIAPP API
navigateTo('uni.makePhoneCall({ "phoneNumber": "01012345678" })') // 拨打电话

自定义规则

可以通过修改 options.rules 对象来规则。例如修改 web-view 规则：

import { navigateTo } from '@zf-uni-helper/navigate-to';

// 如果 url 是 http://example.com 站点，则是 web-view 页面
navigateTo.rules.webView.validator = function (url, rule) {
  return url.startsWith('https://example.com')
};

// web-view 页面 跳转逻辑 `pages/web-view` 页面需要自行实现
navigateTo.rules.webView.handler = function (url, rule) {
  return uni.navigateTo({ url: `/pages/web-view?url=${encodeURIComponent(url)}` })
};

// 预览图片的时候使用原图，带上查询参数
navigateTo.rules.image.transform = function (url, rule) {
  return url + '?original=1'
};

规则参数

| 字段 | 类型 | 描述 | | --------- | -------------------------------------- | ------------------------------------------------------------ | | pattern | RegExp | 匹配正则表达式 | | validator | (value: string, rule: Rule) => boolean | 自定义校验，如果设置了 validator，则 pattern 不生效 | | transform | (value: string, rule: Rule) => string | 在处理的时候进行转换值，执行 handler 前先调用 transform 进行值转换 | | handler | (value: string, rule: Rule) => void | 处理函数 |