Vue组件之创建与使用组件

创建vue组件:

使用Vue.component()方法创建组件
Vue.component()有两个参数
参数1：TagName(标签名)
参数2:{
template:组件模型如： <div> <h1>{{title}}</h1> <p>{{content}}</p> <p>发表时间:{{Date()}}</p> </div>，
props：
组件属性如:
[
“title”,//在组件模型h1中使用
“content”,//在组件模型p中使用
]
}
如图：

使用vue组件

使用vue组件前提是要创建好vue组件，然后使用创建好的vue组件的TagName直接在body中像使用正常的html标签使用即可
如我上面创建得到vue组件使用如下

如图：
运行后：

个人心得：

vue组件应用场景一般在评论区、文章发表等需要对一个模块多次调用时使用，vue组件是将多个标签元素聚集一起组成一个模块。