【汇总】ElementUI中高频次使用代码片段

<el-pagination :hidden="total <= 10" @size-change="initList" @current-change="initList" :total="total" :page-sizes="[10, 20, 50]" :page-size.sync="pageSize" :current-page.sync="currentPage" layout="total, sizes, prev, pager, next, jumper" ></el-pagination>
currentPage: 1, pageSize: 10, total: 0,

<div class="btns"> <el-button size="small" type="primary" plain @click="reset" >重置</el-button > <el-button size="small" type="primary" @click="search()" >查询</el-button > </div>

<el-input placeholder="请输入关键词搜索" suffix-icon="el-icon-search" v-model="input_value" > </el-input>

<el-select size="small" v-model="value" placeholder="请选择" @change="changeSelect(value)" > <el-option v-for="(a,$i) in options" :key="$i" :key="$i" :value="a.value"  :label="a.label" > </el-option> </el-select>
options: [{value: '1', label: '选项1'}, {value: '2', label: '选项2'}, {value: '3', label: '选项3'},], value: '',
changeSelect(value){console.log(value)},

<!-- 空状态 -->
<el-empty v-else style="text-align: center; width: 100%" :image-size="200" description="暂无数据" ></el-empty>

v-loading="loading"
loading:true,
this.loading=false;
showLoad() { this.load = this.$loading({ text: "加载中…" }); },
 hideLoad() { this.load && this.load.close(); },
const loading=this.$loading({lock: true,text: "加载中…",spinner: "el-icon-loading",background: "rgba(0,0,0,0.7)"});setTimeout(()=> {loading.close();},2000);
https://loading.io

//初始化
init(){
},

//搜索
search() {
this.currentPage = 1;
this.init();
},

//重置
reset(){
//相关参数归零
this.currentPage = 1;
this.init();
},

export default {
    data(){
        return{
        }
    },
    watch: {
    },
    computed: {
    },
    created() {
    },
    mounted() {
    },
    methods: {
    },
};