1. Vue组件是什么
-
组件(Component)是 Vue.js 最强大的功能之一
-
组件可以扩展 HTML 元素,封装可重用的代码,可以将组件看作自定义的HTML元素
-
组件系统让我们可以用独立可复用的小组件来构建大型应用
2. 如何使用全局组件
(1)在script标签里注册全局组件
(2) 在html文本里创建组件实例
(3)修改组件的定义,使之能够接受一个 prop
(4)组件实例使用 v-bind 指令,将数据传到循环输出的每个组件中
(5)组件模板用插值表达式进行引用渲染
(html里的组件标签,最终会被定义好的组件里的模板内容替换掉)
<body>
<div id="todo">
<input type="text" v-model="inputValue">
<button v-on:click="handleClickBtn">commit</button>
<!-- 2.在模板里使用组件todo-item -->
<!-- (1)通过list决定循环输出多少个todo-item组件
(2)同时把每一个list项的内容(item)通过v-bind绑定到content变量,传给todo-item组件 -->
<todo-item v