表单 、上传、分页

2.el-form

:v-model="ruleForm"

表单校验：item中的prop（：rules="fRules",） 和 v-model=“ruleForm.resource”

:rules 是data中国的一个用于校验的对象

rules: {
          name: [
            { required: true, message: '请输入活动名称', trigger: 'blur' },
            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
          ],
          region: [
            { required: true, message: '请选择活动区域', trigger: 'change' }
          ],

ruleForm是表单的内容

ruleForm：{
 resource:"",
 name:"",
}

  一列写样式

el-table-column(label="重命名" align="center" width="80px")
    template(#default="{row}")
        el-checkbox(v-model="row.priAll")

3.上传el-uplaod

注意写上@preview 点击查看图片  

auto-upload=“false”，请求时在上传

若要去掉+。可以在样式上去掉

简单的上传文件：

//文件类型，是否显示列表

//多个文件，改变时，删除时，
 导入excel  


 //js 
   improtEx(val){ 
   let fd=new FormData();
   fd.append("file",val.file);
    return Interface(fd); 
   } 

  async importExcel(val){ 
    await this.improtEx(val); 
    this.getList();//刷新列表
    this.$message.info("导入成功"); 
}
　　

　文件列表:file-list="fList"     ，接受的类型 accept="image/*" ，限制 :lmit="4",

:on-exceed="()=> $message.error({showChose:true,message:'图片不少于三个'})"

1.el-pagination

 按要求来，

1.1小型分页 添加small

1.2 添加背景色 background

1.3设置最大的码数 ：pager-count

 

    完整功能