親コンポーネントから子コンポーネントへのデータの渡し方

データの渡し方を忘れないように、メモとして残しておこうと思います。
v-bindとpropsを使いました。

App.vue

<template>
  <div id="app">
    <Number :number="number"></Number>
  </div>
</template>

<script>
import Number from "./components/Number.vue";
export default {
  data() {
    return {
      number: 10,
    };
  },
  components: { 
    Number
  }
};
</script>    

Number.vue

<template>
  <div id="Header">
    <p>{{ number }}</p>
  </div>
</template>

<script>
export default {
  props: ["number"],
};
</script>