vue整理平常。

1.父子組件傳值問題（父到子）：

如 Aipreview.vue 文件(父組件)：  父組件傳遞值-->>子

<template>
<div>
<MyHeader :somedata="some_data"  @self_event="fun1"> </MyHeader> /*父組件 經過屬性直接傳遞 */ 
</div> 
</template > 
<script> 
import MyHeader from "@/components/MyHeader"; 
export default { 
components: { MyHeader }, 
data: function() { 
  return { 
  some_data: { 
   name: "ss", 
   age: 12 
  } 
}; 
},
method:{
　　fun2:function(data1,data2){
   　　console.log(data1,data2)
   }
},
mounted:function(){ 
  //若是有異步操做區更新 this.some_data;那麼somedata的項，必定要所有寫出來，否則對象不會更新 
} 
};
 </script>

子組件：MyHeader.vue( 子組件接收值)  

<template>
  <div>
    <span class="spans" @click="update_pra">{{aa}}</span>
  </div>
</template >

<script>
import MyHeader from "@/components/MyHeader";

export default {
  props: {　　　　　　　　　　　　/*子組件經過屬性來接收值，在此屬性跟 data使用地位相等*/
    somedata: {
      type: {
        type: String,
        default: "OCT"
      }
    }
  },

  data: function() {
    return {
      aa: "能夠觸發父組件",
      sub_data:"i am from sub"
    };
  },
  method:{
　　　　

　　update_pra:function(param){
　　　　this.$emit("self_event",param,this.sub_data)

　　}

 },

  mounted: function() {
    
  }
};
</script>

 

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

 

2.父子組件傳值問題（子到父）：子組件能夠觸發事件，把值傳遞到父組件。