vue父組件中獲取子組件中的數據

<FormItem label="上傳頭像" prop="image">
                    <uploadImg :width="150" :height="150" :name="'avatar'" size="150px*150px" ref="avatar"></uploadImg>
</FormItem>
 <FormItem label="上傳營業執照" prop="businessLicence">
       <uploadImg :width="350" :height="200" :name="'businessLicence'" size="350px*200px" ref="businessLicence"></uploadImg>
</FormItem>

自己寫了個上傳圖片的子組件，父組件需要獲取到子組件上傳的圖片地址，

方法一：給相應的子組件加ref

父組件在最後提交的時候獲取thi.$ref.avatar.相應數據即可，因為在這裡才能保證圖片已經上傳，否則如果圖片沒上傳，拿到的值一定為空。

方法二：$emit()

/*
    子組件
*/
<template>
    <input type='file' @change="changeUrl" />
</template>
<script>
export default {
    methods: {
        changeUrl(e) {
            this.$emit('changeUrl', e.currentTarget.files[0].path)
        }
    }
}
</script>
/*
    父組件
*/
<template>
    <FormItem label="上傳營業執照" prop="businessLicence">
        <uploadImg :width="350" :height="200" :name="'license'" size="350px*200px" @changeUrl="getUrl"></uploadImg>
    </FormItem>
</template>
<script>
export default {
    methods: {
        getUrl(path) {
            //這個就是你要的path,並且會雙向綁定
        }
    }
}
</script>