JEECG BOOT 前端记录

目录

查询

 1、模糊搜索中文

2、下拉框选择

3、文本框

新增

1、添加文本框

 2、图片上传

3、文件上传

4、富文本

 5、下拉框数字回显文字

第一种：

第二种：

展示

1、字典翻译注解@Dict

1.2、字典表翻译用法

 2、点击事件调接口

---

查询

 1、模糊搜索中文

           


//dict:表名school_class,name显示的班级信息，classId得跟id相关联，才能查出name值

2、下拉框选择

           


//dictCode:字典表里的字段

3、文本框

新增

1、添加文本框

 2、图片上传

      


//:isMultiple="true" 允许上传多张

3、文件上传

 

4、富文本

 5、下拉框数字回显文字

第一种：

       


//dictCode去查字典表里对的值
如：值为 0不可见 1可见 

第二种：

       


//dictCode这里是查询表 一共有三个值
1.表名 2.你要显示在下拉框的值（我想显示中文） 3.表的id 这里是你的classId值和这张表的id是有关联的才会查出来

展示

1、字典翻译注解@Dict

字典翻译注解@Dict： 用于列表字段字典翻译（比如字段sex存的值是1，会自动生成一个翻译字段 sex_dictText 值是‘男’）

比如： 用户表有一字段:发布状态,数据库存储的1,2分别表示未发布,已发布,当数据被查询展示在列表上时,就需要将1,2翻译成未已,这就要用到@Dict

后端实体属性上加注解(此处dicCode 对应上述字典编码)

 /**
  * 发布状态（0：未发布 1：已发布）
  */
 @Dict(dicCode = "publish_status")
 private Integer publishStatus;

前端定义column(此处dataIndex原字段名为publishStatus,这里需要定义为publishStatus_dictText,即原字段名+'__dictText')

 columns: [
    //...省略其他列
    {
     title: '发布状态',
     align:"center",
     dataIndex: 'publishStatus_dictText'
    }]

如下两张对比： 

1.2、字典表翻译用法

可通过这个注解来查询出来映射上去班级名称 dictTable=表名，dicCode=当前这个classId和这个表里面的id相对比相同，dicText=映射出来的班级名称

@Dict(dictTable = "school_class", dicCode = "id" ,dicText = "name")
private String classId;

 2、点击事件调接口

发布


methods: {
      publish(record){
        let params ={
          id : record.id,
          publishStatus : 1,
        }
        console.log(params);
        postAction('/aigoes/schooldwadwa/edit',params).then((res)=>{
          message.success({ content: '发布成功!', duration: 1 });
          console.log(res)
          this.loadData();
        })
      }
    }

待更新...