vue_03总结

vue_03总结


1、组件:
	html、css、js的集合体
	vue实例就代表组件
	组件用template实例成员管理html结构,有且只有一个根标签
	子组件可以复用,所以数据要组件化处理,data的值由方法的返回值提供

2、分类:
	根组件:new Vue({}),顶级组件
	全局组件: Vue.component('组件名', {}),不用注册可以在任何地方使用
	局部组件:let 组件名 = {},只有在注册的父组件中才能使用
	
3、组件间传参:
	父传子:自定义属性
	<tag :info="msg"></tag>
	
	let tag = {
		props: ['info'],
	}
	new Vue({
		data: {msg: 12345}
		components: {
			tag,
		}
	})
	
	子传父:自定义事件
	<tag @action="fn"></tag>
	
	let tag = {
		data: {msg: 12345},
		methods: {
			tag_fn() {
				this.$emit('action', this.msg)
			}
		}
	}
	new Vue({
		components: {
			tag,
		},
		methods: {
			fn(info) {}
		}
	})
	
4、vue项目环境
	官网下载安装node => 将npm换源为cnpm => cnpm install -g @vue/cli
	
	=> vue项目创建...

原文地址:https://www.cnblogs.com/zhangchaocoming/p/12071086.html