iview 表格随着添加刷新

使用location.reload()

或者是

路由的 this.$router.go(0)

进行刷新的时候,是会出现一阵的空白区域的,因为是整个页面的刷新

,所以比较缓慢,因此使用了provide/inject的方法。

在App.vue中写入以下代码:

<template>
  <div id="app">
    <router-view v-if="isRouterAlive"/>
  </div>
</template>

<script>
export default {
  name: "app",
  //提供一个依赖
  provide(){
    return {
      reload:this.reload
    }
  },
  data(){
    return {
      isRouterAlive:true
    }
  },
  //声明reload方法,控制router-view的显示或隐藏,从而控制页面的再次加载
  methods:{
    reload(){
      this.isRouterAlive = false;
      this.$nextTick(function(){
        this.isRouterAlive=true
      })
    }
  }
};
</script>

<style>.size{  width:100%;  heigth:100%;}
html,body{.size;
  margin: 0;
  padding: 0;
}
#app {
 .size;}</style>

子页面引用

<script>
export default {
   inject:[‘reload‘] ,
   methods:{
       reload(){
        this.reload()
       }
   }
}
</script>

provide:选项应该是一个对象或返回一个对象的函数。该对象包含可注入其子孙的属性。

inject:一个字符串数组,或一个对象,对象的 key 是本地的绑定名

原文地址:https://www.cnblogs.com/aknife/p/11636919.html

时间: 2024-10-12 21:06:22

iview 表格随着添加刷新的相关文章

iview 表格 某一列中设置radio

在iview 表格 某一列中设置radio,说白了还是要在render中添加,方法为: { title: '业务参数设置', // key: 'pyCode', align: 'center', render:(h, params) => { return h( "RadioGroup", { props: { value: params.row.status*1==1?'可以':'不可以' }, on: { "on-change":(val) => {

使用vue自定义指令合并iview表格单元格

使用vue自定义指令合并iview表格单元格, 我们在开发过程中发现iview表格组件,官网只提供了合并表头的demo,并没有合并表格中的单元格. ivew表头分组:https://www.iviewui.com/components/table#BTFZ 效果图如下: 具体实现思路,通过vue自定义属性来操作dom,达到我们想要的效果: 代码如下: demo.vue  表格页面 <template> <div class="demo"><Table :c

动态给表格TD 添加单击事件

需求:项目中对原有的JQ框架表格功能要进行完善 实现 单元格单击编辑 思路:JS中遍历生成好的表格 动态给TD 添加单击事件. 问题:遍历添加时,给TD 加样式 加属性都可以 但是如果要加单击事件 死活加不上去. 1 //文本控件模版 2 var textTemp = "<input type=\"text\" value={0} />"; 3 var RawData; //原始数据 4 //js控制列 可修改 5 $("tr", $

miniui 给表格行添加监听事件的几种方法以及点击某列列名数据不能排序的问题

最近在使用miniui框架做开发,在做表格行的点击监听事件中发现了几个属性,都可以起到监听效果但是执行的结果却大有不同.好了废话不多说,直接上代码. <div id="pageGrid" class="mini-datagrid" style="width: 100%; height: 100%; border:0;" url="${ctx}/tAXINFO/queryRepeat" autoload="tru

IOS 添加刷新按钮,刷新当前页面

刷新按钮添加在导航栏的右上放,本来已经有了下拉刷新的功能,现在就是不想每次刷新都要跑到最上面,所以添加了这么个按钮. 代码: //添加刷新按钮-2015.10.10 UIBarButtonItem *refreshBtn = [[UIBarButtonItem alloc]initWithTitle:@"刷新" style:UIBarButtonItemStylePlain target:self action:@selector(dataRefresh)]; self.navigat

二.jquery.datatables.js表格数据添加

1.后台php public function addtable(){ $data = $_POST; if(M('yanfa_project')->add($data)){ $this->ajaxReturn("success"); } } 二.jquery.datatables.js表格数据添加

用原生Dom实现向表格中添加数据

<script> document.getElementById("submit").onclick=function(){ //获取输入节点 var name=document.getElementById("iname"); var email=document.getElementById("iemail"); var addresss=document.getElementById("iaddress");

html表格动态添加删除行(有后台操作)

<HTML> <TITLE>Form Object example</TITLE> <HEAD> <script language="javascript"> function delrow1() { var oElement=event.srcElement; while(oElement.tagName!="TR") { oElement=oElement.parentElement; } var oT

Sql语句在SqlServer中创建数据库、表格并添加约束

通过Sql语句来创建数据库与架构 创建数据库 数据库的创建首先是要引用主数据库的,需要在master数据库的环境下进行创建.大致的语法如下: 1 -- 使用master数据库 2 use master 3 -- 创建数据库 4 create datebase [架构名.]数据库名 5 on [primary]--主文件数据描述 6 ( 7 name = '数据库逻辑名', --一般是数据库的名称 8 filename = '数据文件的名字',--全路径 9 size = 12mb, --数据文件