Vue的组件化开发

Vue的组件化开发

1，组件的基本使用

​ 1 创建组件构造器 通过Vue.etednts()方法
​ 2 注册组件 调用Vue.conponent()方法
​ 3 使用组件 在vue实例作用范围内使用组件

<script type="text/javascript">
	//1.创建组件构造器对象
	const cpnC = Vue.extend({
			template:`
								<div>
									<h2>我是标题</h2>
									<p>我是内容adas1</p>
									<p>我是内容，998</p>
								</div>
								`
	})
	//2.注册组件
	Vue.component('my-cpn',cpnC)

​

	const app = new Vue({
		el:"#app",
		data:{
			message:'你好',
		}
	})
</script>

2.全局组件和局部组件的定义方法及其区别

这里定义个两个vue实例，

<div id="app2">
		<cpn></cpn>
	</div>
<div id="app">
	<cpn></cpn>
</div>