概念:
组件(Component)是自定义元素。
作用:
可以扩展HTML元素,封装可重用的代码。
<div id="myView"> ???<!-- 把学生的数据循环输出,用 v-bind动态绑定 props的值到父组件的数据中--> ???<student ???????v-for="student in studentList" ???????v-bind:data="student" ???????v-bind:key="student.id"> ???</student></div>
<!-- 定义模型层,存放学生的数据-->
var myModel = {studentList:[{id:1,name:‘张三‘,height:178},{id:2,name:‘李四‘,height:178},{id:3,name:‘王平‘,height:178},{id:4,name:‘老张‘,height:173}]};
<!-- 创建视图层,接收存放学生数据的界面、数据-->
var myViewModel = new Vue({ el:‘#myView‘, data:myModel });
//导入自己写的js,主要目的是:组件可复用//<script src="js/student.js"></script>//注册Vue.component(‘student‘, { ???//声明props ???props:[‘data‘], ???template: ‘<div><span style="color:red">{{data.id}}</span><span style="color:green">{{data.name}}</span><span style="color:blue">{{data.height}}</span></div>‘});//目的:组件可复用
Vue.js——component(组件)
原文地址:http://www.cnblogs.com/laizhouzhou/p/7966945.html