前言：萌新入职3个月。虽然是后端开发，但是我现在也在写系统的前端页面。上学的时候直接用html、js、jq写前端。不过vue的底层其实是js，只不过是自己封装而已。于是在参考了之前的项目代码，学习了官方文档后，开始自己开发（一路坎坷，踩了很多坑）。这里记录一下这几个月使用vue的一些小经验。1、VUE的组件化。个人理解，vue的组件化使用有点像后端函数调用。写一个vue子组件就相当于在后台写一个函数。然后在需要的地方，只需要在父组件中引用子组件就可以使用了。大大减少代码重复。但是，在使用父子组件时，它们的通信（相互传递参数和事件处理）是一个问题。（一）父组件与子组件的通信：1.父组件传值给子组件：子组件：子组件在props中注册变量{{Name}}
script>exportdefault{name:"SON",props:{Name:String,},data(){return(){}},methods:{},}父组件：1.首先使用import导入子组件folder2.在components中声明子组件3.然后在模板中直接使用components中子组件的命名4.使用v-bind方法绑定子组件props中声明的变量名exportdefault{name:"SON",props:{Name:String,},data(){返回(){sonName:this.Name}},methods:{这里可以写处理sonName的函数},}2.子组件给父组件传值：子组件：（主动）使用$emit给父组件传值importSONfrom"./son.vue";exportdefault{name:"FATHER",components:{SON,},data(){return(){}},methods:{//getSonValue(data)中的数据是子组件传过来的值getSonValue(data){console.log(data)},},}使用$emit不仅可以传值，只要子组件想让父组件做一些事情，就可以用它来传递一个事件给父组件。另外父组件也可以通过ref获取子组件的值子组件：importSONfrom"./直接获取子组件中的值son.vue";exportdefault{name:"FATHER",components:{SON,},data(){return(){}},methods:{getSonValue(data){让sonName=this.&refs.sonComponent.nameconsole.log(sonName)},},}2.VUE组件化注意事项Vue组件化是异步传递值的。如果数据量比较大，很有可能页面已经渲染完了，但是还没有获取到值。这时候可以使用等待取到值再渲染组件
