用户工具

站点工具


web:element-ui
  • 表单el-form
    • ref=“form” :model=“form”,form:{name,region,date1,date2,delivery}
    • el-form-item label=“提示” :rules=“{required,message,trigger:'blur,change'}“支持多条规则type:'email' min max date array2)
    • el-input v-model=“form.name”文本框
    • el-select v-model=“form.region” placeholder下拉框,el-option label value选项
    • el-col :span=“11”,el-date-picker v-model=“form.date1” type=“date”日期
    • el-col :span=“2” class=“line”,el-time-picker v-model=“form.date2” type=“fixed-time”时间
    • el-switch v-model=“form.delivery”开关
    • el-checkbox-group v-model=“form.type”多选,el-checkbox label name复选项
    • el-radio-group v-model=“form.resource”当选,el-radio label单选项
    • el-input v-model=“form.desc” type=“textarea”文本框
    • el-button type=“primary” @click=“onSubmit”提交
  • 表格el-table
    • el-table,v-loading=“listLoading”等待,element-loading-text=“Loading”提示
    • :data=“list”数据,request({url,method,params}).then加载,created(){ this.fetchData() }
    • el-table-column,label=列名,el-tag :type=“scope.row.status | statusFilter”状态
    • filters: { statusFilter(status){ const statusMap={}; return statusMap[status] } }过滤
    • row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}')日期列,@click=“handleUpdate(row)”
    • this.temp = Object.assign({}, row)参数,this.$nextTick(() ⇒ {this.$refs['dataForm'].clearValidate()})
    • el-pagination,pageSizes=[10,100],layout='total, sizes, prev, pager, next, jumper'
  • 控件
    • el-date-picker type=date|time|month v-model v-bind:disabled value-format=“yyyy-MM-dd”
    • el-dialog :visible.sync=“show” @close=“closeDialog” ref=“dialog”,this.$refs.dialog
    • el-upload ref=“upload” :auto-upload=“false” :on-change=“onChange”,onChange(file,fileList),this.$refs.upload.clearFiles()或submit(),:http-request=“uploadFile”,uploadFile(params){ new FormData().append(“file”,params.file); headers:{'Content-Type': 'multipart/form-data'} }
  • 指令
    • v-preventReClick,@click=“submit($event)“,if(event.target.disabled) return
  • 其他:
    • 跳转:this.$router.push(””),{path:'',query:{}},this.$route.query
    • 重置:Object.assign(this.inlineForm,{“param”:””}),this.$refs.upload.clearFiles()
1) 最新版需要vue-cli,tag/3.11.0不需要
2) 多选时至少选一个
web/element-ui.txt · 最后更改: 2021/01/07 11:40 由 admin