前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >wndow.popstate,微信浏览器返回事件, vue mixins

wndow.popstate,微信浏览器返回事件, vue mixins

作者头像
yangdongnan
发布2019-03-28 15:39:19
1.5K0
发布2019-03-28 15:39:19
举报
文章被收录于专栏:日常记录日常记录

微信浏览器返回键按下跳转路由 window popstate, Vue全中 写入 mixins文件

引入
代码语言:javascript
复制
main.js 全局引入
import popstate from './components/newComponent/popstate'

Vue.mixin(popstate)
使用

使用时 this.init(‘router’)

  • 此处router为 留有name属性值
  • router 为空时 执行 history.go(-1)
mixin
代码语言:javascript
复制
export default {
  data () {
    return {
      next : false,
      popStateRouter : ''
    }
  },
  methods : {
    resetRouterName () {
      let that = this;
      that.popStateRouter = ''
    },
    popStateInit ( router = '' ) {
      let that = this;
      that.popStateRouter = router
      try {
        if ( window.__wxjs_is_wkwebview === true ) {
          //function ...  WKWebview ios
          window.addEventListener('pageshow', ( e ) => {
            console.info('执行 ios onpageshow 进入页面')
            e.preventDefault()
            setTimeout(() => {
              that.next = true
            }, 1000);
            that.popStateInitIos()
          }, false)
        } else if ( window.__wxjs_is_wkwebview === false || window.__wxjs_is_wkwebview === undefined ) {
          //function ...  UIWebview
          that.popStateInitAndroid();
        }
      } catch ( e ) {
      }
    },
    popStateInitIos () {
      let that = this;
      console.info('ios', that.popStateRouter)
      
      window.addEventListener('popstate', function ( e ) {
        console.info('进入popstate监听 ios')
        e.preventDefault()
        if ( that.next ) {
          console.info(`通过next 执行 ${that.popStateRouter}`)
          that.$router.push({ name : that.popStateRouter })
          that.next = false;
          that.resetRouterName()
          return false
        }
        // history.go(-1)
      }, false)
    },
    popStateInitAndroid () {
      let that = this;
      console.info('andriod', that.popStateRouter)
      
      window.addEventListener('popstate', function ( e ) {
        console.info('进入popstate监听 andriod')
        e.preventDefault()
        if ( that.popStateRouter ) {
          console.info(`跳转${that.popStateRouter}`)
          that.$router.push({ name : that.popStateRouter })
          that.resetRouterName()
          return false
        }
        // history.go(-1)
      }, false)
    }
  }
}
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019年01月18日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 微信浏览器返回键按下跳转路由 window popstate, Vue全中 写入 mixins文件
    • 引入
      • 使用
        • mixin
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档