我是在<el-dialog> 對(duì)話框中使用表單<el-form>提交數(shù)據(jù),在上傳圖片時(shí),使用<el-upload>標(biāo)簽上傳,此時(shí)問題來了,我明明在上傳成功回調(diào)方法中已經(jīng)將imgUrl重置了啊,但是并沒有回顯出來。
<!--上傳圖片-->
<el-upload
:headers="headers"
:action="uploadPath"
:show-file-list="false"
:on-success="uploadSuccessHandle"
:before-upload="onBeforeUpload"
class="avatar-uploader"
accept=".jpg, .jpeg, .png, .gif"
>
<img v-if="dataForm.imgUrl" :src="dataForm.imgUrl" class="avatar" >
<i v-else class="el-icon-plus avatar-uploader-icon" />
</el-upload>
//上傳圖片成功后回調(diào)的方法
uploadSuccessHandle(e) {
this.dataForm.imgUrl = e.url
}
我思考了會(huì),猜測(cè)是在<el-dialog>中,已經(jīng)彈出顯示的對(duì)話框不能根據(jù)數(shù)據(jù)刷新節(jié)點(diǎn)。
需要加上以下代碼
this.$forceUpdate()
例如:
uploadSuccessHandle(e) {
this.$forceUpdate()
this.dataForm.imgUrl = e.url
}