基本步骤
Vue.js的组件的使用有3个步骤：创建组件构造器、注册组件和使用组件。
Vue.extend()方法创建组件构造器
Vue.component()方法注册组件
在Vue实例的作用范围内使用组件
<!DOCTYPE html><html>
<body>
<div id="app">
<!-- 3. #app是Vue实例挂载的元素，应该在挂载元素范围内使用组件-->
<my-component></my-component>
</div>
</body>
<script src="js/vue.js"></script>
<script>
// 1.创建一个组件构造器
var myComponent = Vue.extend({
template: '<div>This is my first component!</div>'
})
// 2.注册组件，并指定组件的标签，组件的HTML标签为<my-component>
Vue.component('my-component', myComponent)
new Vue({
el: '#app'
});
</script></html>
上面的示例可以改为局部注册的方式：
<!DOCTYPE html><html>
<body>
<div id="app">
<!-- 3. my-component只能在#app下使用-->
<my-component></my-component>
</div>
</body>
<script src="js/vue.js"></script>
<script>
// 1.创建一个组件构造器
var myComponent = Vue.extend({
template: '<div>This is my first component!</div>'
})
new Vue({
el: &
最低0.47元/天 解锁文章
3898
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
