您的位置:首页 > 产品设计 > UI/UE

Vue.js学习系列(四十二)-- Vue.js组件

2017-04-01 00:00 731 查看
组件(Component)是Vue.js最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任

意类型的应用的界面都可以抽象为一个组件树:



1,注册组件

注册一个全局组件的语法格式如下:

Vue.component(tagName, options)

tagName为组件名,options为配置选项。注册后,我们可以使用以下方式来调用组件:

2.全局组件

在vue.js的实例中,我们经常会用到全局组件,这里我们来注册一个简单的全局组件,并使用它。



运行结果如下图:在页面上显示一级标题自定义组件



3.局部组件

Vue.js不仅有全局组件,也有局部组件,在实例选项中注册局部组件,这样组件只能在这个实例中使用:

我们来注册一个简单的局部组件



运行结果同样是将一级标题“自定义组件”显示在页面上。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息