uniapp开发小程序跳转兼容普通页面、tabBar页面、重定向

首先，小程序的跳转的跳转分为三类：分别是

• uni.navigateTo
  保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。
• uni.switchTab
  跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
• uni.redirectTo
  关闭当前页面，跳转到应用内的某个页面。

这些我想开发过小程序的都不陌生，但是我这里进行了一层封装，一个方法可以兼容以上三种形式的跳转

// 是否是h5链接
    isH5Link(value) {
        const urlReg = /(http|https):\/\/([\w.]+\/?)\S*/;
        return urlReg.test(value);
    },
    // 是否是小程序内页面链接
    isMiniPageLink(value) {
        if (value.substr(0, 4) === 'page' || value.substr(0, 5) === '/page') {
            return true;
        }
        return false;
    },
    // 页面跳转,支持小程序内页面和h5链接  linkType: ordinary: uni.navigateTo 其他为uni.redirectTo
    pageJump(linkUrl, linkType = 'ordinary') {
        if (!linkUrl) {
            return ;
        }
        // 调用本页面的其他方法
        if (utils.isH5Link(linkUrl)) {
            if (linkType === 'ordinary') {
                uni.navigateTo({ // 在本js内可以直接调用uni.navigateTo
                    url: '../webView/webView?froms='+ encodeURIComponent(linkUrl)
                });
            } else {
                uni.redirectTo({
                    url: '../webView/webView?froms='+ encodeURIComponent(linkUrl)
                });
            }
        } else if (utils.isMiniPageLink(linkUrl)) {
            let hyperlink = '';
            // 如果不是以/开头,前端补/
            if (linkUrl.substr(0, 1) === 'p') {
                hyperlink = '/' + linkUrl;
            } else {
                hyperlink = linkUrl;
            }
            if (linkType === 'ordinary') {
                uni.navigateTo(
                    {
                        url: hyperlink,
                        // 比较巧妙的处理 
                        fail: function() {
                            // 支付宝没有走fail
                            uni.switchTab({
                                // 兼容跳tab页面的情况
                                url: hyperlink
                            });
                        }
                    }
                )
            } else {
                uni.redirectTo({
                    url: hyperlink
                })
            }
        }
    }

不知道，你有没有注意到，在判断是不是小程序内部页面的时候，对以page开头或者以/page开头，我这边都认为是小程序内部页面，所以跳转的时候，又做了一次处理，即如果没有/,我这边按会自动添加/,我觉得这是这个方法的亮点之一，其次，问你们一个问题，你觉得我这边跳转到webview页面的时候为什么要编码呢？

答案就是：有一些页面本身后面就会有很多参数，如果不进行编码，微信会认为是不合法的域名，但是如果这个链接是写死的，微信就认为没有问题，这个我也比较郁闷。最后一点，我认为比较巧妙的是，我在 uni.navigateTo跳转失败的时候，让它尝试进行tabBar页面的跳转，这个当时主要是要着急上线，如果按照平时，肯定会传一个标志，来告诉我是什么链接，如果是tabbar页面，就采取uni.switchTab，但这个如果单靠前端分辨不出来是不是tabbar页面，当时还查了一下，看看有没有现成的方法来判断一个链接是不是tabbar页面，但是无果，最后发现，uni.navigateTo有fail回调，就想着如果失败就用uni.switchTab岂不是一行代码就搞定了。