Vue.component的属性

Vue.component(‘组件名称’,{})中的属性

1.template

作用:用来定义组件的html模板
使用:直接接字符串

Vue.component('组件名称'{
template:'

aaa

'
})

2.data

作用
定义一个在组件中使用的数据
定义

Vue.component('组件名称'{
	data:fuction(){
		return(
			msg:'aa'
			//每个组件使用的数据都是独立的
			//每个数据都是新创建的
			//就算用的是同一个组件模板
			//var a=0
			//而直接return a
			//则会多个页面上的组件同时使用同一个数据源
		)
	}
})

使用
使用插值表达式{{msg}}

3.methods

作用
定义一个在组件中使用的方法
定义

Vue.component('组件名称'{
	methods:{
		方法名(){}
	}
})

4.props

作用
将父组件的数据传递到子组件
定义

Vue.component('组件名称'{
props:['对接父组件数据的名称'],
})

与data中的区别
props是从父组件传递过来的,只能读取,不能修改父组件中的值
data是子组件私有的,可读可写

你可能感兴趣的:(vue学习笔记)