Vue->封装返回上一页方法

前言

特别是在移动端开发项目中会出现这样一个场景,在二级或者详情页的时候顶部导航或有出现一个返回上一页的按钮,该按钮的做用就是点击以后返回上一页或者历史页面,那么问题来了,是否是有不少个这样的页面或者不少个这样的图标咱们都要手动去绑定一个方法,再写一遍一样的逻辑呢,本文章带你封装一个全局的返回上一页的方法前端

第一步


在main.js中将方法挂碍到原型链上
Vue.prototype.back = () => $router.bck(-1)
复制代码

第二步


在须要使用返回上一页的事件中直接这样写
<div @click="back">返回上一页</div>
复制代码

说明


该back方法就是咱们在全局经过vue原型链挂载的公用的方法,就不用每次去从新定义给一个事件写一遍放方法,显得太繁琐还很差维护。

写在最后

但愿个人分享对你有所帮助,更多资讯请持续关注,我会分享愈来愈多的实战经验哦! 或加入大前端知识体系社区一块儿探索技术:608229520vue

相关文章
相关标签/搜索