Vue组件
组件是可复用的 Vue 实例，
且带有一个名字：在这个例子中是 <testcomponent>。
我们可以在一个通过 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用：
我们可以对组件进行任意次数的重复
组件里面的template是html代码 是模板
组件里面可以有data，但是这个data必须是一个函数，比如Vue官网的代码
Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.button>' })
我们一般用树的形式来进行对组件的组织。
有时候我们需要向组件里面传递数据。上面说了组件的data里面只能是函数。所以需要我们通过 Prop 向子组件传递数据
Prop 是你可以在组件上注册的一些自定义 属性。当一个值传递给一个 prop 属性的时候，它就变成了那个组件实例的一个 property。为了给博文组件传递一个标题，我们可以用一个 props 选项将其包含在该组件可接受的 prop 列表中：（可以看做是标签中的自定义属性） v-bind
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>组件title>
head>
<body>
<div id="app">
<testcomponent v-for="item in items" v-bind:test1="item">testcomponent>
div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js">script>
<script>
//定义组件
Vue.component("testcomponent",{
props:['test1'],
template:' {{test1}} '
})
var vm= new Vue({
el: "#app",
data: {
items:["java","c语言","python"]
}
});
script>
body>
html>