vue学习记录笔记（父子组件传值：props）

一、关于父子组件的传值：

1、父传子：使用props关键字（子组件可接收父组件传过来的值，但是不可以更新父组件中的值）

props是在子组件中使用的，并且有两种定义方法：
第一种为数组形式，比如：props:['msg']
                这种形式的话是未标明变量的类型
第二种为对象形式：比如：如下列示例中
                这种形式标明了变量类型，可以更好的区分。
第三种为指定验证方式：比如：props: {
    msg: {
      type: String, //指定值类型
      required: true, //是否为必传项
      default: "aaa", //默认值,可有可无，
    },

在子组件中：使用props定义一个msg，并且使用h1标签显示
<template>
  <div class="hello">
    <h1>{
 { msg }}</h1>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  }
}
</script>

在父组件中，首先需要引入子组件（组件与组件中的引入使用import...from...）

<template>
  <div id="app" style="display: flex">
    <img style="flex: 1" alt="Vue log