快活林资源网 Design By www.csstdc.com
我就废话不多说了,大家还是直接看代码吧~
<template> <div> 判断页面是首次进入还是再次刷新 </div> </template> <script> export default { data(){ return{ } }, mounted () { //第一种方法 // if(window.name == ""){ // console.log("首次被加载"); // window.name = "isReload"; // 在首次进入页面时我们可以给window.name设置一个固定值 // }else if(window.name == "isReload"){ // console.log("页面被刷新"); // } //第二种方法 if (window.performance.navigation.type == 1) { console.log("页面被刷新") }else{ console.log("首次被加载") } }, methods: { }, } </script> <style scoped> </style>
补充知识:VUE-Router 同一页面第二次进入不刷新 问题以及几个解决方案
最近正好遇到一个问题,修改用户的头像,修改后再进入用户主页,发现改了之后即使数据变了。。页面也不会重新渲染。。。
下面提供集中解决方案来给予大家参考:
1. 可以在刷新的页面定义一个参数, 这样每次都会渲染出不同的页面:
route 实例化命名配置:
{ // 用户信息 path: '/accountDetail/:randKey', name: 'accountDetail', component: accountDetail, meta: {requiresAuth: true} },
跳转 的地方配置:
var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']; var maxLength = 15; var res = '_jsonpphotochange'; for (var i = 0; i < maxLength; i++) { var id = Math.ceil(Math.random() * 35); res += chars[id]; } // res 为随机字符串,下面是跳转: this.$router.push('/accountDetail/' + paramsAccount);
2. 可以让全局的页面都重载,这个比较狠冗余也多,慎重点用:
在App.vue下修改:
<template> <div id="app" class="app"> <transition :key="key"> <router-view class="router-view"></router-view> </transition> </div> </template> <script type="text/ecmascript-6"> // import {mapState} from 'vuex'; export default { name: 'app', computed: { key() { return this.$route.name !== undefined "htmlcode">watch: { '$route' (to, from) { this.httpGetUserInfo(); // 这是我ajax获取用户信息的方法 } } // 这样每次路由执行就会运行这个方法,第一次打开不会运行,你需要用created()方法来执行下ajax方法。以上这篇vue 判断页面是首次进入还是再次刷新的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
快活林资源网 Design By www.csstdc.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
快活林资源网 Design By www.csstdc.com
暂无评论...
更新日志
2024年11月15日
2024年11月15日
- 老头杯第二届规则是什么 英雄联盟老头杯第二届规则介绍
- 王崴-爵士听堂.蓝色波萨(HQCD)[WAV+CUE]
- 群星《欧美动听情歌·柔情第5季》2CD【DTS-WAV分轨】
- [极品珍藏]德意志进行曲集卡拉扬SACD[WAV+CUE]
- 前暴雪制作人呼吁反击DEI 玩家:夺回文化!
- 腾讯证实子公司Sharkmob大规模裁员:整个市场很低迷
- 荣耀加冕 问鼎冠军 中国代表队获第四届东亚电竞锦标赛团体总冠军
- 污甩乐队.2024-Let.the.dirt.left【摩登天空】【FLAC分轨】
- 杜德伟.1994-ALL.FOR.YOU(英)【滚石】【WAV+CUE】
- 群星.2013-百代好声音ADMSCD1【EMI百代】【WAV+CUE】
- 群星《私人音乐精选示范碟》PRIVATEMUSIC 发烧唱片名碟[WAV+CUE][1.1G]
- 山口百惠《あなたへの子守唄》日本索尼钢刻字首版[WAV分轨][1.1G]
- 群星《宝丽金20周年特别发烧版》1:1母盘直刻限量编号[低速原抓WAV+CUE][1G]
- 凤飞飞.1984-仲夏(夏艳)[WAV]
- 常安《民歌红·江南燕》DTS-ES6.1[WAV]