より多くの人気アプレットでは、唯一の製品を作るために場合公众号H5页面
とAPP
それほど完璧に表示され、常に小さな車のトラフィックをキャッチするこのツアープログラムを感じて、何が欠けていただろう、と私の心は非常に厄介です。私は車の中で得たところ、このドライブでは、同社はまた決めました。
あなたは小さな言葉を再書き込みするために、日常的な手順に従ってください、だけでなく、コストを支払うために時間を感じるようにしたい場合は、非常にやりがいのある、あまりにも素晴らしいです。それ以来、彼の心のフラッシュは、アプレットと呼ばれる弟のように見える覚えてwebview
、webview
文字通り(Baiduの翻訳から)ページビューを意味するもの、です。公式の定義はそうです:
ウェブビューコンポーネントは、アプレットは自動的にページ全体を覆われて、コンテナはページを運ぶために使用することができます。海外のアプレットを搭載したパーソナルタイプは、使用の種類をサポートしていません。
単に私たちは小さなプログラムに入れることができると言う<web-view>
私たちにリンクするコンポーネントHTML
のページを。換言すれば、公共マイクロチャネル既に書き込まれた数字は、H5页面
直接小さなプログラムに移動させることができます。公共プログラムの数が少ないの転送を完了するためのコードの1行、1行のコードは、我々は1つのより多くのトラフィックの入り口、小さなプログラムコードの問題の再開発を解決するためのコードの1行をしましょう。それは本当にエキサイティングな思考死んでいます。
私は関心がリンクに突入するとwebview
、代わりに^ _ ^の独自のドメイン名を持つこの:(リンクアドレスのような実際のプロジェクト)
<!--微信小程序index.wxml-->
<web-view src="https://www.hxkj.vip/"></web-view>
しかし、ときジャンプページ、クリックしてください。aigoが、私が行ってきました、私は本当にショックを受け、そのページの無左上隅でした!![戻る]ボタン!!戻っていない原因、唯一のポイントを抑えることができ、後戻りはありません、これはおかしいではありません。。。
それは、それぞれが、あるスキーム、のようだったH5页面
リターンでナビゲーションバーのボタンを追加しますが、一瞬考えた小さなプログラムのヘッドは、ナビゲーションバー、プラスの言葉を持っているので、この解決策は、望ましいことではありません[醜い]破裂する-それはあなたが記述するために一つの単語を使用することができ、非常にまとまりのないです。決定的に捨てられました!
ページが、その後、二つの小さなプログラムをジャンプ戻るボタンがあるでしょう、2ページ目の左コーナーをトップにすることを発見された場合、他の小さなプログラムを見ました。2ページ目も置くならば、我々は、と考えることができますwebview
ジャンプの後のリンクを表示するために使用されるコンポーネントを、それはまだ完璧なソリューションではないのですか?そこで問題は、それの2番目のページへのリンクスプレッドにどのようにホームページをクリックし、ありますか?
我々はできるH5页面
使用ページメソッドアプレットにジャンプするページを、そして運ぶパラメータ:jssdk
H5
wx.miniProgram.navigateTo
weburl
//H5页面js
navigate(modelName) { //控制页面跳转---小程序、公众号、非微信跳转方式 【modelName---vue路由名字】
this.isMiniProgram((res)=>{//判断是否是小程序页面的回调函数
if (res) {//小程序页面
wx.miniProgram.navigateTo({url: '../webview/webview?weburl=https://www.hxkj.vip/#/' + modelName});
} else {
this.$router.push({name: modelName});//非小程序页面使用vue路由跳转
}
})
},
isMiniProgram(callback) { //是否为小程序环境
//是否在微信环境
if (!isWeixin()) {
callback(false);
} else {
//微信API获取当前运行环境
wx.miniProgram.getEnv((res) => {
if (res.miniprogram) {//小程序环境
callback(true);
} else {
callback(false);
}
})
}
}
その後、アプレットの2ページ目にwebview.js
受信weburl
パラメータ、共有するために設定ページへのリンクに注意を払います:
// pages/webview/webview.js
Page({
/**
* 页面的初始数据
*/
data: {
url:''
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.setData({
url: options.weburl //获取H5页面传递过来的weburl
});
},
/**
* 用户点击右上角分享***【特别注意这里,配置分享链接一定要给首页链接,要不然别人点进来又是没有返回按钮的哦】***
*/
onShareAppMessage: function () {
return {
path: '/pages/index/index'
}
}
})
とに割り当てられたプロパティwebview.wxml
src
<!--pages/webview/webview.wxml-->
<web-view src="{{ url }}"></web-view>
わかりましたので、へのアプレットの完璧な解決策でwebview
問題がジャンプページの後に戻るボタンではありません。
:ソース記入してくださいhttps://www.jianshu.com/p/a7bb1a826548
著者:TSY
パーソナルスペース:https://www.hxkj.vipを