ios WKWebView 內嵌h5開發實戰

ios用的wkwebview，我主要負責h5頁面開發（vue+ts）

以下是開發h5需要做的事，開始了哦

其中的getparams等是與ios約定好的事件

private paramsinfo =

;private a ="";
created()
/* 方法 ios => h5 ----------start--------- */
private
getparams
(params: string)
private
a(val: string)
//為了確保你用的時候它傳過來了，利用監聽，
//另外，如果傳的方法(如getparams)有多個如a，b,只需要監聽ios傳最後傳過來的值
@watch
('a'
)achange()

// h5 => ios 事件函式

//傳值給ios的值不傳就給null,不能為空！！！
export
function
sendmsg
(handleevent: string, msg: any |
null
=null
)

yarn add vconsole

點開右下方vconsole

裡面更多功能自己去發現吧

1.時間處理

應該是safari瀏覽器不支援時間格式分割符為 『-』，處理一下就行

const sdate =

newdate
(start.
replace
(/-/g
,'/'
))

//這種出現解析失敗就是ios傳過來的值的某個欄位有換行符，json.parse會導致失敗。

this
.baseorderinfo =
json
.parse
(order.
replace
(/(\n)+/g
,'\\\\n').
replace
(/\r/g
,'\\\\r'))
this
.baseorderinfo.comment =
this
.baseorderinfo.comment &&
this
.baseorderinfo.comment.
replace
(/\\n/g,'
')

-會-那你這樣做吧

v-html

="fetchorderinfo.comment"
>
p>

注意事項(總結)：

——ios傳值延遲，注意使用監聽，拿到了再去操作

——給ios傳值不傳給null！！

——時間轉換，將分隔符替換一下

——專案上線後請求介面始終返回status = 0,參見頁面上線請求介面返回satus為0

——還有ios傳值鍵值序列化解析失敗問題

H5內嵌原生app

因此，可以看到內嵌其實並不難，難就難在要適配 原生與web互動 資料傳遞等，當然我們也可以使用vue來開發h5介面 一 如何實現互動？答案是使用第三方外掛程式jsbridge 1.通過js偽造請求 原生攔截獲取資料 原理類似於jsonp 首先在js中定義乙個函式並掛載在window下，然後在原生中呼...

iOS WKWebView載入本地網頁

property strong,nonatomic wkwebview webview property nonatomic,copy nsstring url 我這裡是將html資源檔案放置在工程內乙個bundle的資料夾內 拼接後的網頁路徑 self url self componentfile...

APP 內嵌H5, H5遇到的 相容性問題

1.ios 中日期格式 new date 2019 10 11 無效 解決 new date 2019 10 11 replace g 2.ios 中日期格式 new date 2019 07 24 11 35 00.0 無效 解決 new date 2019 07 24 11 35 00.0 re...