h5調(diào)起原生分享面板,展示更多功能方案

WebView右上角三個(gè)點(diǎn)按鈕,點(diǎn)擊之后會(huì)彈出分享面板,最底部展示的是h5自定義的功能,目前有兩種方案展示自定義功能。方案如下:

方案1:

h5調(diào)用原生API

使用框架:WebViewJavascriptBridge

方法名:more
傳入?yún)?shù)為數(shù)組對(duì)象:

{
 dataArray:(
{icon:"圖標(biāo)",title:"名稱",url:"鏈接"},
{icon:"圖標(biāo)",title:"名稱",url:"鏈接"},
{icon:"圖標(biāo)",title:"名稱",url:"鏈接"}
)
} 
//數(shù)組元素個(gè)數(shù)不超過三個(gè)

h5使用WebViewJavascriptBridge調(diào)用原生API的方法可以參考這篇文章:http://www.itdecent.cn/p/bfd062af37c9

方案2:

h5通過在url后面加參數(shù)的方式給app傳遞數(shù)據(jù)

請(qǐng)按照如下步驟操作:
1.把下面json字符串里面的title、icon和url的數(shù)據(jù)改為需要傳遞功能的名稱、圖標(biāo)和鏈接

[
    {
        "title": "服務(wù)評(píng)價(jià)",
        "icon": "https://portal-minio.nwpu.edu.cn/evaluation-center/625d0f63e4b0960b62f48fe9.png",
        "url": "https://www.baidu.com"
    },
    {
        "title": "咨詢反饋",
        "icon": "https://portal-minio.nwpu.edu.cn/evaluation-center/625d0f67e4b0960b62f48feb.png",
        "url": "https://www.baidu.com"
    },
    {
        "title": "小希問答",
        "icon": "https://portal-minio.nwpu.edu.cn/evaluation-center/625d0f5ee4b0960b62f48fe7.png",
        "url": "https://www.baidu.com"
    }
]

2.打開網(wǎng)址http://www.esjson.com/urlEncode.html
把上面的json數(shù)據(jù)粘貼到如下位置,點(diǎn)擊URL編碼

3.復(fù)制編碼結(jié)果

4.把編碼結(jié)果放到url的后面(dataArray為參數(shù)名)

https://www.aaa.com?dataArray=編碼結(jié)果

示例:https://www.aaa.com?dataArray=%5B%0A%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%22title%22%3A%20%22%E6%9C%8D%E5%8A%A1%E8%AF%84%E4%BB%B7%22%2C%0A%20%20%20%20%20%20%20%20%22icon%22%3A%20%22https%3A%2F%2Fportal-minio.nwpu.edu.cn%2Fevaluation-center%2F625d0f63e4b0960b62f48fe9.png%22%2C%0A%20%20%20%20%20%20%20%20%22url%22%3A%20%22https%3A%2F%2Fwww.baidu.com%22%0A%20%20%20%20%7D%2C%0A%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%22title%22%3A%20%22%E5%92%A8%E8%AF%A2%E5%8F%8D%E9%A6%88%22%2C%0A%20%20%20%20%20%20%20%20%22icon%22%3A%20%22https%3A%2F%2Fportal-minio.nwpu.edu.cn%2Fevaluation-center%2F625d0f67e4b0960b62f48feb.png%22%2C%0A%20%20%20%20%20%20%20%20%22url%22%3A%20%22https%3A%2F%2Fwww.baidu.com%22%0A%20%20%20%20%7D%2C%0A%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%22title%22%3A%20%22%E5%B0%8F%E5%B8%8C%E9%97%AE%E7%AD%94%22%2C%0A%20%20%20%20%20%20%20%20%22icon%22%3A%20%22https%3A%2F%2Fportal-minio.nwpu.edu.cn%2Fevaluation-center%2F625d0f5ee4b0960b62f48fe7.png%22%2C%0A%20%20%20%20%20%20%20%20%22url%22%3A%20%22https%3A%2F%2Fwww.baidu.com%22%0A%20%20%20%20%7D%0A%5D

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容