vue父子组件传值

时间:2022-10-31 12:25

vue父子组件如何传值呢?我们一起了解一下吧!

父子组件就是在一个vue文件中引入另一个vue文件,被引入vue文件就是子组件,引入vue文件的vue文件就是父组件。以下是父子组件传值的具体操作。

1.父向子传值props

父组件:<child :inputName="name">

子组件:

(1)props: {
inputName: String,

required: true

}

(2)props: ["inputName"]

vue父子组件传值

2.子组件向父组件传值$emit

子组件:

<span>{{childValue}}</span>

<!-- 定义一个子组件传值的方法 -->

<input type="button" value="点击触发" @click="childClick">


export default {
data () {
return {
childValue: '我是子组件的数据'

}

},

methods: {
childClick () {

this.$emit('childByValue', this.childValue)

}

}

}

vue父子组件传值

关于父子组件传值,我们就分享到这啦!

标签:
随便看看
本类推荐
本类排行
热门标签

我国国家通讯社行不行啊细狗新年贺词祝福语2023年祝福语新年新年贺词新年贺词祝福语居家抗病毒小药箱除夕高速免费吗2022年除夕高速免费吗春联春联句子大全春联句子大全七字年夜饭十二道菜年夜饭十二道菜单年夜饭吃什么年夜饭吃什么菜吃年夜饭的寓意年夜饭黑芝麻菊花茶晒菊花茶腌腊肉送妈妈生日礼物汉白玉送闺蜜水钻送女人礼物爸爸生日送礼物送老公