<body>
<div id="app">
<!-- 组件中的数据(data,props,computed)只能在组件自己的模板中使用 -->
<!-- <com>{{child}}</com> -->
<input type="text" v-model="str">
<com>{{str}}</com>
</div>
</body>
<script src="vue.js"></script>
<script type="text/html" id="com">
<div>
<h1>
<slot></slot>
</h1>
</div>
</script>
<script>
Vue.component("com",{
template:"#com",
data(){
return {
child:"这是子组件中的数据"
}
}
});
new Vue({
el:"#app",
data:{
str:"这是根组件的数据"
}
});
</script>