vue中定义组件components

1. 基本信息

组件是对你 html 标签的一个拓展

组件里面的内容就是你模板的内容

组件分为全局组件局部组件

  • 对象当中定义的组件都是局部组件

2. 如何定义(注册)组件

  1. 定义组件需要使用components选项。components是一个对象,该对象的属性是组件的相关配置信息。
  2. 组件当中至少应该拥有template属性或render方法。
  3. 使用时,可以将组件的名字作为标签来使用。
  4. 注意:⬇⬇====================================================⬇⬇
  5. 当你的组件名称当中使用驼峰命名时,在使用组件时,名字小写与大写之间应该用-来分割。
  6. 组件当中的数据,与其外部的实例是不共享的。
  7. 在组件内定义的数据(data)
    1. 必须要是一个函数
    2. 函数必须要有返回值
    3. 返回值必须要是一个对象
  8. 注意:⬆⬆====================================================⬆⬆

3. 基础代码展示:

/--------------------------html---------------------------------------/

<zujian></zujian>

/--------------------------js------------------------------------------/
new Vue({
	el:"#root",
	data:{
	... ...
	},
	components:{     //可以看到 components 是复数形式,说明我们可以在这里面定义多个组件
	zujian:{         //定义了一个名字为 zujian 的组件  //它是一个对象形式
		template:`   //指定一个模板
			<div>定义了一个组件,名字为 zujian </div>
		`
		}
	}
})
发布了63 篇原创文章 · 获赞 6 · 访问量 1231

猜你喜欢

转载自blog.csdn.net/qq_44163269/article/details/105063803
今日推荐