javascript - 最近在看vue组件部分,父组件和子组件到底是什么？

问题描述

问 题

是不是这种定义的就是父组件.

Vue.component('child',{
        props: ['myMessage'],
        template: '<span>{{ myMessage }}</span>'
});

下面这种调用的就是子组件吗?

<div id="example5">
        <child my-Message="hello"></child>
</div>

还有这句话该怎么理解呢? ==> 类似于用 v-bind 绑定 HTML 特性到一个表达式，也可以用 v-bind 动态绑定 props 的值到父组件的数据中。每当父组件的数据变化时，该变化也会传导给子组件：

div>
  <input v-model="parentMsg">
  <br>
  <child v-bind:my-message="parentMsg"></child>
</div>

是说v-bind:my-message和定义的props进行绑定了吗?

还有就是老提到的字符串模板是es6的模板字符串还是什么？不好意思，小弟初学vue，可能问题有点多

解决方案

谢邀！
父子组件其实就相当于父子元素一样的关系。
你在父组件中使用子组件时不是和正常的html一样的么？
如你举的例子：

<div> // 对于child来说这就是个父组件
  <input v-model="parentMsg">
  <br>
  <child v-bind:my-message="parentMsg"></child> // 这就是子组件
</div>

而后你所问的那段话其实就是vuejs里一直在说的双向绑定
同样拿你的栗子来说，你在input里键入的文本会被实时的更新到子组件child中

这篇关于javascript - 最近在看vue组件部分,父组件和子组件到底是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！