微信小程序web-view实例

标题图

微信小程序web-view实例

index.js

//index.js
//获取应用实例
const app = getApp()

Page({

      /**
       * 页面的初始数据
       */
      data: {

      },
      goBaidu: function(e) {
        wx.navigateTo({
          url: '../out/out', 
          success: function(e) {
console.log(e);
          }, 
          fail: function(err) {
console.log(err);
          }
        })
      },


        /**
         * 生命周期函数--监听页面加载
         */
        onLoad: function(options) {

          },

          /**
           * 生命周期函数--监听页面初次渲染完成
           */
          onReady: function() {

          },

          /**
           * 生命周期函数--监听页面显示
           */
          onShow: function() {

          },

          /**
           * 生命周期函数--监听页面隐藏
           */
          onHide: function() {

          },

          /**
           * 生命周期函数--监听页面卸载
           */
          onUnload: function() {

          },

          /**
           * 页面相关事件处理函数--监听用户下拉动作
           */
          onPullDownRefresh: function() {

          },

          /**
           * 页面上拉触底事件的处理函数
           */
          onReachBottom: function() {

          },

          /**
           * 用户点击右上角分享
           */
          onShareAppMessage: function() {

          }
      })

index.wxml

<!--index.wxml-->
<view class='wrapper'>
  <button class='wepay' bindtap='goBaidu'>点击跳转</button>
</view>

out.wxml

<web-view src="https://www.baidu.com/"></web-view>

图1 图2

达叔小生：往后余生，唯独有你
You and me, we are family !
90后帅气小伙，良好的开发习惯；独立思考的能力；主动并且善于沟通
简书博客： 达叔小生
https://www.jianshu.com/u/c785ece603d1

结语

• 下面我将继续对 其他知识 深入讲解 ，有兴趣可以继续关注
• 小礼物走一走 or 点赞