VUE + element-ui实现当前页面/表格刷新方法
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
之前在做elementui的项目,一些新增,编辑,删除等操作后,需要刷新当前页面或者表格,看官方文档没找到合适的方法,之前是直接重新再调一遍后台接口进行数据的刷新,今天发现一个不错的方法,来记录一下
App.vue
中配置入下
<template>
<div id="app">
<router-view v-if="isRouterAlive"></router-view>
</div>
</template>
<script>
export default {
name: 'App',
provide(){
return {
reload: this.reload
}
},
data(){
return {
isRouterAlive:true
}
},
methods:{
reload(){
this.isRouterAlive=false
this.$nextTick(()=>this.isRouterAlive=true)
}
},
}
</script>
<style>
html,
body {
margin: 0;
padding: 0;
}
.el-table__body tr.current-row>td{
background-color: #BBBBBB;
}
</style>
需要使用的页面中调用如下
export default {
inject:['reload'],
components:{
AddEditDialog
},
data() {
//删除
del(){
if(this.currentRow.id!==undefined){
const data = {
id: this.currentRow.id
}
this.$store.dispatch('deleteEnterprise',data)
const data1 = {
keyWord:''
}
setTimeout(()=>{this.$store.dispatch('getEnterpriseList',data1)},500)//表格重载
}else{
this.$store.dispatch('ShowMsg',{value:'请选中删除对象',type:'error'})
this.reload()
}
},
this.reload()直接调用即可
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
7 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献2条内容
所有评论(0)