常用快捷方法 -- html

1、数据延迟及渲染延迟

nextTick(dom全部渲染完成后执行,通常用与延迟加载)
    mounted(){
      this.init() //先加载
        this.$nextTick(()=>{
          this.afterInit()   //后加载
        })
     }
2、setTimeout(多长时间后执行)
     mounted(){
       this.init() //先加载
         this.setTimeout(()=>{
           this.afterInit()   //后加载
         },0)
　　　　}

2、element input 只输入数字

<el-input size="mini" oninput ="value=value.replace(/[^0-9.]/g,'')" v-model="xxx"/>

3、初始化页面闪动

1、css样式增加v-cloak -- 单个dom
    [v-cloak]{
       display:none
    }
    <div v-cloak>{{message}}</div>
2、根目录进行绑定 -- 全局
    <div style="display:none;" :style="{display: 'block'}"></div>
    vue在渲染之前，style="display: none;"让页面不显示
    vue渲染完成了，:style="display: block;"让页面显示

4、table前端假分页

<el-table v-loading="listLoading" 
:data="caseInfoList.slice((currentPage-1)*pagesize,currentPage*pagesize)"
>
</el-table>
// 切换每页条数时
handleSizeChange(size) {
   this.pagesize = size;
   console.log(this.pagesize)//每页下拉显示数据
}
// 切换当前页码时
handleCurrentChange(currentPage) {
   this.currentPage = currentPage;
   console.log(this.currentPage) //点击第几页
}

标签：渲染,--,html,快捷,currentPage,页面,display,加载
来源： https://www.cnblogs.com/dy1997/p/15539202.html