vue的元件通信，父子傳參

随着代碼量的提示，肯定是要把彈框、上傳等一些公用的表單封裝成元件的

父傳子：

:seldata="SiteList"為父傳子，seldata子元件接收的值，SiteList為父元件傳給子元件的值

//父元件引用并注冊元件
<addDialog ref="addJob"  @submit="setName" :seldata="SiteList"></addDialog>
           

js

//子元件，下面是幾種接收方法，因為這裡傳的是數組用：
props: ['seldata'],或 seldata: {type: Array,}一種即可
<script>
  export default {
  //數組
    props: ['seldata'],
  //對象
	props:{ title:'' }
  //自定義類型
    props: {//接收的值可以是：Array,String，Object，Boolean，以及可以設定接受的default預設值 和 required必填校驗
	    seldata: {
	      type: Array,
	      required: false,
	      default: []
	    },
	    title: {
	      type: String,
	      default: ''
	    }
	    item: {
	      type: Object,
	      required: true
	    },
	    Flag: {
	      type: Boolean,
	      default: false
	    },
	},
    data() {}
  }
</script> 
           

子傳父：

@submit=“setName” 是子傳父

例如：送出表單時，把送出的内容formData傳給父元件，

submit就是傳給父元件的參數名稱。

//子元件
<script>
  export default {
    methods:{
      submitForm() {
        this.$emit('submit', this.formData)
      },
    }
  }
</script> 
//父元件 在方法setName中val接受即可
setName(val){//指派
	this.SitetList = val
},
           

這個部落格寫的也不錯，感興趣的可以看一下：