<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../vue.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!--view层-->
<div id="myApp">
<hyr>你好,世界</hyr>
</div>
<div id="herApp">
<hyr></hyr>
<aa></aa>
</div>
</body>
<script type="text/javascript">
//创建一个组件
var hyr = Vue.extend({
template:"<div><h1>我是创建的第一个组件</h1><h2>二级标题</h2></div>"
});
//全局注册组件
Vue.component("hyr",hyr);
//创建局部组件
var aa=Vue.extend({
template:"<span>我是局部组件</span>"
});
//view-model层
new Vue({
el:"#myApp"
})
new Vue({
el:"#herApp",
//局部注册组件(component需要加s)
components:{
//前面aa定义组件名 后面aa指上面的局部组件aa
"aa":aa
}
})
</script>
</html>
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
