项目场景：

提示：这里简述项目相关背景：

例如：
查看列表中的某一条，显示这条的详情信息(这里的详情是一个弹框子组件)–后台管理系统

问题描述

提示：这里描述项目中遇到的问题：

在父子组件传参时，父组件将值传到子组件后，子组件进行数据展示，在第一次传参时可以正常显示，第二次传值子组件的值就不更新了。

问题：在于父子组件渲染机制。子组件里的created只会在初始化执行一次，虽然第二次父组件的数据变化了,但是created不会再执行了，以至于在created里面的赋值就不会有响应了；

父组件
 
 
<div :parenData ="datas"></div>
 
<script>
data(){
  return{
   datas:"1"
 }
},
methods:{
  changeData(){
    this.datas= "2";
 }
}
</script>





子组件
<div>{{msg}}</div>
 
<script>
data(){
  return{
    msg:""
  }
},
//子组件里的created只会在初始化执行一次，虽然第二次父组件的数据变化了,但是this.msg并没有赋值最新的数据
created(){
 this.msg = parendData;
},
props:["parendData"],
//解决方法 数据监听并且重新赋值
watch:{
    parendData(n,o){ //n为新值,o为旧值;
      this.msg = n;
    }
},
</script>

原因分析：

提示：这里填写问题的分析：

我们知道父子组件遵循单向数据流。出现这种原因是 你的子组件里用了n变量去接收与父组件通信的t，只会在第一次初始化子组件的时候拿到值，如果你直接用t就可以观察到变化了，想要继续使用n，你需要动态监听t的变化并给n赋值。原因清楚上代码！

解决方案：

提示：这里填写该问题的具体解决方案：

例如：1.监听父组件传过来的值； 数据监听并且重新赋值
2.还有一种，就是用v-if频繁的创建销毁子组件；