vue中组件刷新,避免加载缓存?
在element-ui table中插入了html文件,每一次展开都会发送请求,后台都会更新这两个文件,但是页面总是加载上一次请求得到的html文件。给iframe绑定了key,然后每次请求成功后都改变key值,但没什么用
html:
<el-table-column type="expand" v-loading="loading">
<template>
<div class="scatter" style="float: left;width: 50%;" id="scatter">
<iframe src="static/picScatter.html" frameborder="0" class="pic" style="height: 400px;width: 100%;margin: 0;" id="scatterPic" :key="scatter"></iframe>
</div>
<div class="box" style="float: right;width: 50%;" id="box">
<iframe src="static/picBox.html" frameborder="0" class="pic" style="height: 400px;width: 100%;margin: 0;" id="picBox.html" :key="box"></iframe>
</div>
</template>
</el-table-column>
data:
data () {
return {
scatter: 0,
box: 1,
methods:
getRowKeys (row) {
return row.bodysite
},
expandSelect (row, expandedRows) {
var that = this
console.log(row)
if (expandedRows.length) {
that.expands = []
if (row) {
that.expands.push(row.bodysite)
}
}else{
that.expands = []
}
this.loading = true
this.$axios
.get('taxonsDetail', { params: { id: this.speciesInfo.id,site: row.bodysite } })
.then(res => {
console.log(res.data)
if (res.data.results === "success"){
this.box += 1
this.scatter += 1
}
})
}