vue变量传值_vue组件传值--详细版

vue组件传值在日常开发中比较常见，在官方文档里面也有介绍，但是对于新手理解起来会有一点生涩。所以今天就把这个拉出来写一次。

一般有三种传值方式：1.父传子、2.子传父、3.兄弟组件之间通信

1.父组件向子组件传值

一般会在子组件里面定义props来做接收，这是比较常见的情况

这是父组件

我是父组件

我发送给第一个组件的信息是:{ {msg}}

import ChildOne from "../components/children1";

import ChildTwo from "../components/children2";

export default {

components: {

ChildOne,

ChildTwo

},

data() {

return {

msg: "我是父组件，我给你发消息",

};

}

};

可以看到我在第一个子组件上面传入了一个msg,那么在子组件上就需要定义一个msg用来接收传进来的参数

这是第一个子组件

我是第一个子组件

我接受到的父组件的消息是：{ {msg}}

export default {

props: {

msg: { <