アプレットのWebViewページジャンプボタンは完璧なソリューションを返さない後

より多くの人気アプレットでは、唯一の製品を作るために場合公众号H5页面APPそれほど完璧に表示され、常に小さな車のトラフィックをキャッチするこのツアープログラムを感じて、何が欠けていただろう、と私の心は非常に厄介です。私は車の中で得たところ、このドライブでは、同社はまた決めました。

あなたは小さな言葉を再書き込みするために、日常的な手順に従ってください、だけでなく、コストを支払うために時間を感じるようにしたい場合は、非常にやりがいのある、あまりにも素晴らしいです。それ以来、彼の心のフラッシュは、アプレットと呼ばれる弟のように見える覚えてwebviewwebview文字通り(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页面使用ページメソッドアプレットにジャンプするページを、そして運ぶパラメータ:jssdkH5wx.miniProgram.navigateToweburl

//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.wxmlsrc

<!--pages/webview/webview.wxml-->
<web-view src="{{ url }}"></web-view>
わかりましたので、へのアプレットの完璧な解決策でwebview問題がジャンプページの後に戻るボタンではありません。

:ソース記入してくださいhttps://www.jianshu.com/p/a7bb1a826548
著者:TSY
パーソナルスペース:https://www.hxkj.vipを

同様に、あなたは私のマイクロチャネル公共数を見ることができます

マイクロチャンネル公衆数

おすすめ

転載: www.cnblogs.com/hashtang/p/11456099.html