1.环境搭建
- 下载 vue-cli：
npm install -g vue-cli - 初始化项目：
vue init webpack vue-demo - 进入vue-demo文件夹：
cd vue-demo - 下载安装依赖：
npm install - 运行该项目：
npm run dev
2.父组件向子组件传值
- src/components/文件夹下建一个组件，Home.vue
- 创建子组件，在src/components/文件夹下新建一个文件夹，在新建文件夹中新建一个组件Child.vue
在Child.vue中创建props，用于接收父组件传递的值
复制代码{ {key}}: { {item}}
在Home.vue中注册Child组件，并在template的div标签中添加home-child标签，标签中使用v-bind指令绑定c。子组件通过props就可以接受到这个父组件传递的值。
复制代码
结果
3.子组件向父组件传值
给按钮绑定点击事件ChildClick 在事件的函数中使用$emit来触发一个自定义事件，并传递一个参数，这个参数就是子组件要传递给父组件的值。
复制代码{ {key}}: { {item}}{ {data}}
在父组件中的home-child标签中监听该自定义事件，并添加一个响应该事件的方法ShowChild。
复制代码
结果：
点击按钮后：