1. 程式人生 > >小程式通過 url 向內嵌 H5 傳參注意事項

小程式通過 url 向內嵌 H5 傳參注意事項

當在小程式中通過 url 向 <web-view> 內嵌的 H5 傳參時,當包含特殊字元時需要進行編碼處理(不然 <web-view> 中是拿不到值的,小程式竟然沒有錯誤提示...):

1、test.wxml

<view>
  <web-view src="{{url}}"></web-view>
</view>

2、test.js,對引數進行編碼處理:

Page({

    /**
     * 頁面的初始資料
     */
    data: {
        url: 'https://xxx.xx.com'
    },

    /**
     * 生命週期函式--監聽頁面載入
     */
    onLoad: function(option) {
        let loginName = encodeURI(wx.getStorageSync('loginName'));

        try {
            //相關操作
            }
        } catch (e) {
            wx.navigateTo({
                url: '../login/login'
            })
        }

        let pageUrl = encodeURI(option.url);
        this.setData({
            url: `${this.data.url}${pageUrl}loginName=${loginName}`
        });

    },
    onReady: function() {

    },
    onShow: function(option) {
        
    }

})

3、H5 端獲取引數時需要進行解碼處理。

//獲取位址列引數
    getQueryString: (name) => {
        let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        let r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return unescape(decodeURI(r[2]));
            return null;
        }
    }