首页 > 其他分享 >【keng】 Vue2 多次传参进入同一页面 页面不走生命周期函数

【keng】 Vue2 多次传参进入同一页面 页面不走生命周期函数

时间:2023-11-01 17:55:44浏览次数:27  
标签:传参 keng 周期函数 key Vue2 页面

比如 一个搜索跳转功能  搜索 123 进入页面加载数据

再次搜索 456  还是进入这个页面 这个页面就不会走生命周期了

 

解决方案

在App.vue 上 为 router-view 增加一个key 

这个key 就是随便写一个随机数就可以 不要重复

eg: 

 

标签:传参,keng,周期函数,key,Vue2,页面
From: https://www.cnblogs.com/shirunfeng/p/17803739.html

相关文章

  • React Native在非组件的地方使用页面跳转(interceptors拦截器处跳转页面)
    官方文档:https://reactnavigation.org/docs/navigating-without-navigation-prop/修改APP.jsimport{NavigationContainer}from'@react-navigation/native';import{navigationRef}from'./RootNavigation';exportdefaultfunctionApp(){r......
  • vue2 单页面应用兼容 ie & 对象不支持"append"属性或方法
    在平时如果用到vue2但是打开ie测试的时候发现代码没起到预期的效果(作用)的话。就要用到polyfill和browser来对你的vue代码转成es5语法啦。具体用法是:先下载polyfill和browser的js文件然后引入polyfill和browser的js文件1<scriptsrc="./graphic_js/pol......
  • Vue数据更新页面却没有更新的几种情况以及解决方法
    情况一:Vue无法检测实例被创建时不存在于data中的变量原因:由于Vue会在初始化实例时对data中的数据执行getter/setter转化,所以变量必须在data对象上存在才能让Vue将它转换为响应式的。例如: 12345newVue({  data:{},  template:'<div>{{message......
  • React Native 页面调试工具 react-native-vdebug
    yarnaddreact-native-vdebugimportReactfrom'react'import{createNativeStackNavigator}from'@react-navigation/native-stack'import{getRouter}from'./config'import{ErrorBoundary}from'../component/light......
  • 导入个Excel页面直接卡死,该如何解决
    JavaScript是单线程的语言,也就是说同步代码都需要排队去执行,这样就会造成很多问题,就比如:数据量大的excel文件的导入导出,会造成整个页面出现“假卡死”的现象。什么是“假卡死”呢?意思就是页面其实并没有卡死,但是用户做一些操作时,页面并没有及时给到反馈,这就会让用户觉得页面卡死......
  • 如何修改URL而不重新加载页面?
    内容来自DOChttps://q.houxu6.top/?s=如何修改URL而不重新加载页面?有没有办法在不重新加载页面的情况下修改当前页面的URL?如果可能的话,我想访问#哈希之前的部分。我只需要更改域名之后的部分,所以它不像是违反了跨域政策。window.location.href="www.mysite.com/page2.......
  • 【Azure Function App】如何修改Azure函数应用的默认页面呢?
    问题描述当在Azure中创建了一个函数应用(FunctionApp)后,访问默认URL会得到一个默认的页面。是否有办法修改这个默认页面呢?  问题解答在之前的博文中,介绍了修改AppService的默认页面。1:【Azure应用服务】AppService默认页面暴露Tomcat版本信息,存在安全风险 :https://www.cnbl......
  • [-005-]-Python3+Unittest+Selenium Web UI自动化测试之页面滑动
    1.上下滑动a.滑动#滑动至页面底部:js1="window.scrollTo(0,document.body.scrollHeight)"self.driver.execute_script(js1)#滑动至页面顶部:js2="window.scrollTo(0,0)"self.driver.execute_script(js2)c.纵向滚动条通过scrollBy坐标来滚动#纵向滚动条通过scr......
  • 短视频app源码,Flutter组件--搜索页面布局
    短视频app源码,Flutter组件--搜索页面布局 classLayoutDemoextendsStatelessWidget{ constLayoutDemo({Key?key}):super(key:key); @override Widgetbuild(BuildContextcontext){  returnPadding(   padding:constEdgeInsets.all(10),   c......
  • UniApp实战技巧:页面导航、数据传递和组件通信,以及资源管理和优化
    UniApp是一个基于Vue.js的开发框架,可以使用它快速构建跨平台的移动应用。本文将介绍UniApp中的一些实战技巧,包括页面导航、数据传递和组件通信。这些技巧可以帮助开发者更好地使用UniApp进行开发。1.页面导航在UniApp中,我们可以使用uni.navigateTo和uni.redirectTo等方法进行页面......