刚入门vue,发现很多坑,对很多框架兼容性不太友好,比如layui等

每次删除相关信息,更新相关信息,不会主动刷新当前页面内容,只能手动刷新

第一步,我们在跟组件理由设置一个参数,用来判断是否需要刷新

<router-view v-if = 'isRouterAlive'></router-view>

在跟组件添加
provide(){
return{
reload:this.reload
}
},
data(){
return {
currentUser_name:localStorage.getItem('currentUser_name'),
isRouterAlive:true, //要记得返回这个,不然的话,路由都不见了
}
},
注册一个reload方法
reload(){
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
},
最后在子组件里头进行注册
inject:['reload'],
使用的时候调用
this.reload();就可以了

												

vue每次修改刷新当前子组件的更多相关文章

  1. Vue中利用$emit实现子组件向父组件通信

    Vue中利用$emit实现子组件向父组件通信 父组件 <template> <div> <p>我是父组件</p> <child :isShow=& ...

  2. 总结Vue第二天:自定义子组件、父子组件通信、插槽

    总结Vue第二天:自定义子组件.父子组件通信.插槽 一.组件: 组件目录 1.注册组件(全局组件.局部组件和小demo) 2.组件数据存放 3.父子组件通信(父级向子级传递数据.子级向父级传递数据) ...

  3. vue系列(一)子组件和父组件

    父组件传递数据到子组件props 父组件 <template> <div class="main"> <div class="top&quo ...

  4. vue中父级与子组件生命周期的先后顺序

    1.vue的生命周期 2.views/createrCustormer.vue为父级     <template>     <expressService />   </ ...

  5. vue.js事件传值之子组件传向父组件以及$emit的使用

    在项目开发中,有时候会遇到一种需求比如是:在子组件中,通过一个事件,比如点击事件,去改变父组件中的某个值,下面来看看是怎么个流程 还是先截图目录结构 父组件为app.vue,components中的文 ...

  6. vue watch 可以监听子组件props里面属性的改变

    子组件watch 可以监听其props里面属性的改变 当changeFather导致calm改变时,会执行console.log('props change');

  7. Vue页面刷新方法(子组件改变数据后兄弟组件刷新,不闪烁)

    todo https://blog.csdn.net/qq_40571631/article/details/91533248

  8. vue 子组件修改父组件传来的props值,报错

    vue不推荐直接在子组件中修改父组件传来的props的值,会报错 [Vue warn]: Avoid mutating a prop directly since the value will be ...

  9. VUE 父组件与子组件交互

    1. 概述 1.1 说明 在项目过程中,会有很多重复功能在多个页面中处理,此时则需要把这些重复的功能进行单独拎出,编写公用组件(控件)进行引用.在VUE中,组件是可复用的VUE实例,此时组件中的dat ...

随机推荐

  1. Ubuntu 下超简单的安装指定版本的nodejs

    第一步 指定版本源 执行 curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash - setup_5.x 需要安装的版本号,替换数字就 ...

  2. 基于Selenium的web自动化框架

    转自 : https://www.cnblogs.com/AlwinXu/p/5836709.html 1 什么是selenium Selenium 是一个基于浏览器的自动化工具,它提供了一种跨平台. ...

  3. CodeForce 517 Div 2. C Cram Time

    http://codeforces.com/contest/1072/problem/C C. Cram Time time limit per test 1 second memory limit ...

  4. django1.4 简单事例 ,根目录下templates

    django发展很快,但是有的是用的老版本,比如我现在看到一个项目,它用的是 Django1.4,而且app不是创建在了项目的根目录下,这样,它的Setting中设置就会不一样,若是设置错误,就会找不 ...

  5. webpack学习笔记(四)

    1 webpack的垫片 举个例子,在main文件中引入jquery和doash两个库: import $ from 'jquery'; import _ from 'lodash'; import ...

  6. Vue01

    1.vue.js库的下载 vue.js是目前前端web开发最流行的工具库,由尤雨溪在2014年2月发布的. 另外几个常见的工具库:react.js /angular.js 官方网站: 中文:https ...

  7. day02 格式化字符串

    字符格式化2019-04-01 方法一 通过f + {} 格式化字符串 name = input("Name: ")age = input("Age:")sco ...

  8. taro 报错及解决

    1.解决:taro 升级到最新版(npm install -g @tarojs/cli) 错误 组件编译 组件src/pages/xxx/xxx.tsx编译失败! TypeError: callee. ...

  9. redhat 开课啦

    今天是三八女神节. 终于开课啦,为考取RHCE准备.

  10. 【转载】 Java中String类型的两种创建方式

    本文转载自 https://www.cnblogs.com/fguozhu/articles/2661055.html Java中String是一个特殊的包装类数据有两种创建形式: String s ...