vue 父子组件传值缓存解决方案
在平时开发中,经常会出现例如(tab切换组件的情况)切换的页面均为子组件,会出现父组件传值缓存的情况--------第一次进入页面数据不变
原因:因为进入页面请求的接口是异步请求,数据没有及时更新
解决方法:
父组件:
组件传值
<Option :content="permissions" v-if="activeName == 0" :Mathrand="Mathrand"></Option>
return:
return {Mathrand:100
} //声明一个随机数变量
javascript
AccessTo(num) {this.$ajax.get(this.uri('*********')+num).then(res => {this.permissions = res.data.data;this.Mathrand = Math.random() //接口请求完毕以后重新为随机数赋值}).catch(err => {this.loading = false;})},
子组件:
接受参数
props: {content: {type: Object,default: () => {}},Mathrand: {type: Number}}, //接受传递的参数
监听随机数,再做相应操作
watch: {'Mathrand': function (val, nv) {this.ReturnsParameter = this.content.templateconst {allModerator,nowModerator,member,level,assignModeratorId,assignMemberId} = this.content.template}},
此方法主要是每次切换组件时,刷新获取父组件传递的新参数
vue 父子组件传值缓存解决方案相关推荐
- vue父子组件传值的一些坑(深浅拷贝)
本文章转载:https://www.yht7.com/news/116487 1.问题描述 父组件传值给子组件,子组件改变传过来的值后,父组件的值也会跟着改变. 这个问题比较冷门,平时如果对组件通信使 ...
- vue父子组件传值:详解父组件向子组件传值(props)
vue父子组件传值:父组件向子组件传值用的是props 1.定义父组件 1)父组件想要向子组件传值时,那么需要在子组件引入的地方绑定一个属性,属性值就是要传的数据,并且要在父组件中引入子组件. 2)这 ...
- vue父子组件传值之 $emit和props
vue父子组件传值之 $emit和props 前言 子组件向父组件传值 父组件向子组件传值 前言 在进行vue的项目中,我们难免会需要父子组件之间进行传值,父子组件传值可以通过 $emit和props ...
- Vue父子组件传值----$emit子传父
Vue父子组件传值是个比较经典的问题,在这里,咱们先谈一下,子组件给父组件传值. 这是一个子组件 <!-- 子组件1 --> <template><div class=& ...
- Vue父子组件传值问题
今天在编写vue子组件时遇到的两个问题来分享以下 父子组件传值问题 父组件 <md-editor ref="mdEditor" :text="form.conten ...
- vue父子组件传值之异步之后子组件无法拿到父组件传的值
在vue中父子组件传值是非常常见的,父组件给子组件传值使用的是props,子组件给父组件传值使用的是$emit 但是今天就不详细的介绍父子组件之间传值,在这里我们介绍的是子组件在异步请求回来的参数无法 ...
- vue 父子组件传值
父子组件传值 最常用的方法(4种) 1 . 父组件 传递数据 给子组件(props)vue官方文档 特别注意!!特别注意!!特别注意!! props传值的类型如果是Object类型,如对象,数组等,传 ...
- 快速理解Vue父子组件传值
组件化开发是目前前端开发必备的开发技能,组件化开发可以大大提高开发效率 今天整理一下Vue的父子组件传值方式,方便还没有理解的朋友学习. 1.父组件向子组件传值 <!-- 父组件 --> ...
- VUE父子组件传值(含实例)
vue父子组件通信 这里的movies数组和message字符串,相当于是在父组件中对要传给子组件的数据做赋值或者计算等操作. 1.父传给子(在子组件中改数据) 父组件: 1.在子组件上绑定数据arr ...
最新文章
- 转载:JQuery制作的选项卡改进版
- 我的世界——用一桶水一直灭岩浆一直刷黑曜石
- python 100题_python3.0练习100题——001
- 台州银行登录显示服务器异常,台州银行网上银行异常问题处理
- VisualBasic 版 (精华区)
- 解密 Go interface 的类型转换原理
- 我年薪百万,孩子教育花掉一半
- python 列表为空_如果列表为空,则Python返回False
- 【docker】docker持续集成CI/持续部署CD
- Silverlight4安装记录
- No virtual method
- 笔记本能ping通但是telnet不通
- 开源一款苹果 macOS 工具 - AppleParty(苹果派)
- Euresys eVision 加载和保存图像
- 高德地图 API,点击地图标记获取自定义标记 (Marker) 中的信息
- binlog恢复误删数据
- 分治算法--快速傅立叶变换
- c语言字母概率,C/C++知识点之智邮普创c语言面试题 ---- 字母概率
- Verilog语法之运算符
- 教你用 python 画圣诞树