前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue项目如何实现返回上一页

vue项目如何实现返回上一页

作者头像
德顺
发布2019-12-11 15:49:58
9K0
发布2019-12-11 15:49:58
举报
文章被收录于专栏:前端资源

vue 返回上一页有两种方法:

如果使用的是 vue-router ,this.$router.go(-1) 就可以回到上一页。 history.go(-1) 是回到浏览器上一页。

但是由于 Vue 应用是单页应用,浏览器的访问历史未必和 Vue 的浏览历史相同。

还有一点,就是使用 router 跳转的时候,Vue 不会重新加载 CSS 。比如从 A 页面跳到 B 页面,会沿用 A 页面中的 CSS 样式,我在 A 页面中设置了 .content 的上边距是 20px ,B 页面没有设置边距,但如果从 A 页面跳到 B 页面,B 页面中的 .content 也会带有 20px 的上边距。

解决办法就是给 style 标签添加 scope 属性。

Vue的 style 中使用 scope 属性,浏览器渲染后,会给每个组件中的元素增加自定义属性,浏览器渲染样式时会变成 data-v-xxx

这也是 scoped 的工作原理,所以在子组件中写的元素,只有子组件中的自定义属性,而父组件中加的样式,最终浏览器渲染时是找不到对应的元素的,(因为父组件中样式给出的自定义属性是不一致的),所以子组件中的样式没办法在父组件中修改。

这样也就解决了,页面跳转上个页面的 CSS 样式也被带过来的问题。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

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

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

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

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档