插入新数据后重置waterfall组件,重新渲染后计算位置不正确
newb-pjr opened this issue · comments
<waterfall class="content" :gutterWidth="10" :gutterHeight="10" ref="waterfall" v-if="showWaterfall">
<waterfall-item class="content-item" v-for="(item, index) in photoList" :order="index" :key="index" :width="290">
<img :src="item.Tplj" width="100%">
<bottom-info></bottom-info>
<div class="dropdown">
<el-dropdown @command="handleCommand">
<div class="dropdown-btn">
<i class="el-icon-caret-bottom"></i>
</div>
<el-dropdown-menu class="dropdown-menu" slot="dropdown">
<el-dropdown-item>
<i class="icon-check"></i> <span>查看</span>
</el-dropdown-item>
<el-dropdown-item>
<i class="icon-edit"></i> <span>编辑</span>
</el-dropdown-item>
<el-dropdown-item>
<i class="icon-Set-cover"></i> <span>设置封面</span>
</el-dropdown-item>
<el-dropdown-item>
<i class="icon-Topping"></i> <span>置顶</span>
</el-dropdown-item>
<el-dropdown-item :command="{handle: 'delete', data: item}">
<i class="icon-delete02"></i> <span>删除</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</waterfall-item>
</waterfall>
_deletePhoto (pictureID) {
axios.delete('/web/deletePicture', {
params: {
pictureID
}
}).then((resp) => {
if (resp.data.Status) {
this.successTips('删除图片')
this.showWaterfall = false
this._getPhotos()
this.$nextTick(() => {
this.showWaterfall = true
})
} else {
this.errorTips('删除图片', resp.data.Message)
}
})
}