当前位置:首页 > 技术分析 > 正文内容

vue父组件修改子组件的值(通过调用子组件的方法)

ruisui884个月前 (01-13)技术分析23

props只支持第一次加载这个组件的时候获取父组件的值,后续修改父组件的值得时候子组件并不会动态的更改。

然而我们想要通过父组件修改子组件的值要怎么做呢?

可以通过ref的方式调用子组件的方法改变子组件的值。

子组件

<template>

<div>

<span>{{data}}</span>

</div>

</template>

<script>

export default {

data() {

return {

data:'就要被修改啦'

};

},

methods: {

a(val) {

this.data=val;

},

},

};

</script>


父组件

<template>

<div>

<child ref='child'></child>

</div>

</template>

<script>

export default {

mounted(){

setTimeout(()=>{

this.$refs.child.a("把你修改了");

},3000)

}

components:{

child:()=>import("../components/child.vue")

}

};

</script>


好啦问题就解决啦

————————————————

版权声明:本文为CSDN博主「冲啊使劲冲」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。

原文链接:https://blog.csdn.net/qq_49279305/article/details/120902373

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/250.html

标签: vue 小程序
分享给朋友:

“vue父组件修改子组件的值(通过调用子组件的方法)” 的相关文章

「Git迁移」三行命令迁移Git包含提交历史,分支,tag标签等信息

问题描述:公司需要将一个git远程服务器的全部已有项目迁移到一台新服务器的Gitlab中,其中需要包含全部的提交纪录,已有的全部分支与全部打tag标签,目前此工作已全部迁移完毕,特此记录一下操作步骤环境描述:1. 要迁移的远程Git:Gitblit2. 迁移目的Git:Gitlab3. 暂存代码的P...

VIM配置整理

一、基本配色set number set showcmd set incsearch set expandtab set showcmd set history=400 set autoread set ffs=unix,mac,dos set hlsearch set shiftwidth=2 s...

复盘总结:从0到1,企业微信小程序开发11步走

作者复盘了从域名准备到内容发布的整个过程,这是项目团队一起回忆整个产品总结出来的经验,值得我们学习,与大家分享。去年接手了两个微信小程序的开发项目,作为一位产品人员,在和开发供应商进行磨合的时候也遇到了许许多多的问题。如今项目已进入收尾阶段,之前也参考了许多其他做微信小程序的同行同事的经验,再做一次...

微信企业号首款永久免费应用问世

7月14日,微信企业号移动办公应用领跑者——办公逸宣布:其所研发的微信办公应用将永久免费,企事业单位只要拥有微信企业号都可以免费安装办公逸各项应用,此举标志着微信办公免费时代现已到来!据悉,办公逸(www.bangongyi.com)现已推出四大微信办公套件,分别为:移动办公管理套件、客户关系管理套...

微信小程序发展越来越快,Flutter应用开发越来越低效?

目前的疑惑微信小程序发展的越来越快,目前小程序甚至取代了大部分 App 的生态位,公司的坑位不增反降,只能让原生应用开发兼顾或换岗进行小程序的开发。以我的实际情况来讲,公司应用采用的 Flutter 框架,同样的功能不可避免的就会存在 Flutter 应用开发和微信小程序开发兼顾的情况,这种重复造轮...

大容量SSD太贵买不起,这三种低成本方案也能让硬盘速度起飞

现在的游戏文件夹体积动不动就突破100GB,256GB、512GB容量的SSD装不了几个游戏就满了。虽说现在SSD价格一直在降,但是1TB及更大容量的SSD价格依然比较高。如果你对硬盘容量、速度有较高要求,又不想花太多预算的话,这三种低成本硬盘加速方案一定要了解一下。锐龙用户的福利——StoreMI...