上一篇我们聊了如何用 Vue.js 创建一个简单的组件，这次咱们再往前走一步，讲讲 Vue.js 的父子组件通信。组件开发里，最重要的就是让组件之间能够“说话”，数据能流通起来。废话不多说，直接开干！

父组件传数据给子组件

1. 父组件用 props 给子组件传值

在上一篇的按钮组件基础上，我们稍微改进下。假设我们有一个表单组件 MyForm.vue，里面有两个按钮，一个提交，一个重置：

父组件代码

<template>
  <div>
    <h3>请填写表单</h3>
    <input type="text" placeholder="输入内容" v-model="inputValue" />
    <MyButton :label="'提交'" :type="'primary'" @click="handleSubmit" />
    <MyButton :label="'重置'" :type="'secondary'" @click="handleReset" />
  </div>
</template>

<script>
import MyButton from './MyButton.vue