vue2.x组件间传值及在vue子组件中操作父组件数据时生命周期的问题

前言

在做项目中遇见一个bug， vue在子组件内部操作父组件数据时，在生命周期mounted和created中给页面渲染父组件的值页面渲染是正常的，但是控制台会报错找不到值！ 此文记录下vue组件之间如何传值取值，和bug的解决方法。

正文

父组件给子组件传值—props 实现父组件向子组件传值。

父组件内：msg是绑定的自定义属性，类似我们原生html 给标签自定义属性一样

<child-pack  :msg ="myMsg" @listenTochildEvent="changeFromChild"></child-pack>

<script >
import childpack from './childPack.vue' //引用子组件
export default{
   
  name: 'FatherPack',
  components: {
    childpack },
  data(){
   
      return（）{
   
           myMsg：‘我是父组件参数’,
           fartherMsg：{
   
           	testMsg:{
   
				code:01,
				name:'test'
				}
			}
       }
  },
  mothods:{
   
  	changeFromChild（item,）{
   
   		//一些操作
	}
  }

}
</script>

子组件传值到父组件 – this.$emit()

在子组件中：

export default{
   
    methods: {
   
          changeFather(){
   
             this.$emit("listenTochildEvent","我是子组件的参数");
          },
        //可以传递参数，参数可以是值、对象、数组等类型。
        //  changeFather(pms){ 
        //    this.$emit("listenTochildEvent",pms);
       //   },