基于spring boot+vue开发项目遇到的问题汇总

**

软件

1. idea 2021.3.1
2. navicat premium 12
3. mysql 8.0

前端

1. vue前端框架
2. element plus
3. Echarts 5.3.0
4.

后端

**1. hutool
2. mybatics plus
3. **

前端vue遇到的问题

1. (未解决)element-plus的table使用中,容易越界,不可以自适应屏幕宽,溢出一部分,出现网页横向滚动条
2. 后端返回的值，前端对返回的值进行判断，进行相应的展示。

 "typeid" label="垃圾类种">
  

3.将div中空间四等分

   

        "width:50%;height:50%;float: left"/>
        "width:50%;height:50%;float: right"/>
        "width:50%;height:50%;float: left"/>
        "width:50%;height:50%;float: right"/>
  
 

4. 引用Echarts时,一共有两种办法,一种是将组件全部导入;另一种是按照需求导入。注意：因为Echarts的渲染是基于 Canvas 渲染器，所以当按需导入时，一定要先引入渲染。
5. created（）和mounted（），前者是页面加载前，不可以进行二次渲染，而后者是页面加载后，获取到对象后，可进行再渲染。
6. （未解决）一个vue文件中只能渲染一个Echarts，不能渲染多个Echarts**
7. vue中给对象增加属性时，如果视图不更新，或直接将数据存到session中，可以使用this.对象.要新增的属性名=属性值，例如res.data.role=1
8. 使用echarts插件时，我们在获取到数据之后，才可以画我们要的表，所以如果要是在获取到数据之前画，页面是空白，解决这个办法就是添加延时函数，使获取到数据之后，短暂延时后画表。setTimeout(()=>{this.drawLine(res.data.records[0].score);},100)，这个办法是异步加载！

后端springboot遇到的问题

1. 对路由传参时，根据id值对数据库的删除，使用占位符{abc}，并且使用注解@PathVariable，得到路由字段
   2.通过在resources文件夹中定义的mapper文件夹,可以创建与entity同名的实体对象的xml文件,自定义查询语句。
   
   注意：定义特别的办法需要在mapper接口定义，方可在方法接口中使用。
2. 实现对每一种垃圾的详细数据分别查询，实现方式有两种：①通过重新创建xml文件（后果代码冗余）②在接口中对xml文件传值，在接口函数中，参数前添加注解@Param（"flag"），在xml文件中，接受参数使用#{flag}。
3. (未解决)执行sql查询语句时,当查询结果有重复的话,自动去重。。投放记录
4. 问题:在分页的时候，获取的total是正确的，但是，记录数目不正确，查询记录中如果有对象是列表，会把列表的记录数目算入其中！
   解决办法:检查定义查询要映射的实体类,如果将实体类的列表定义为不存在,就会报错,因为他查出来的没有列表限制,所以记录数目会按照列表的数目走!
   这个方法使用之后，但是仍未解决问题。
   解决办法：将嵌套的列表，设置为子查询，简而言之就是，先查用户，再查用户的记录，然后再封装。
   如果不使用子查询，就是用户先一次性查完结果，后来再处理封装，那么这样对于分页插件来说，可能存在着以上问题，可能的由来是根据自己sql语句的差异决定，所以有时候可以正常运行分页插件，有时候则不能。
   子查询方法（链接）。
5. 由上面的问题,因为整个方法都会改动,之前的selectpage()方法中能对查询结果的wrapper参数将不会存在,得自己写查询方法，进行模糊查询。

where name like CONCAT('%',#{search},'%')

因为like中右边的语句右引号，所以如果将参数直接写到里面的时候where name like '%#{search}%'，不会引用参数,只是将#{search}作为字符，所以要想解决这个问题，就是先对数据处理一下，这里用到CONCAT连接方法实现。
6. 根据当前时间,自动填充,然后插入到数据库中。
在实体类中，对日期字段进行注释

@TableField(value = "recorddate",fill = FieldFill.INSERT)
private Date recorddate;

定义方法类，重写插入的函数。

```sql
@Slf4j
@Component
public class MyMetaObjectHandler implements MetaObjectHandler {

    // 插入时的填充
    @Override
    public void insertFill(MetaObject metaObject) {
        log.info("start insert fill ....");
        //setFieldValByName(String fieldName, Object fieldVal, MetaObject metaObject)
        this.setFieldValByName("recorddate", new Date(), metaObject);
        this.setFieldValByName("updateTime", new Date(), metaObject);
    }

    // 更新时的填充
    @Override
    public void updateFill(MetaObject metaObject) {
        log.info("start update fill ....");
        this.setFieldValByName("updateTime", new Date(), metaObject);
    }
}

注：这里还包括更新操作，方法来自文章。

数据库遇到的问题

**1. 数据库的表不可以使用admin命名，虽然可以创建这个表，但是无法执行此表的查询，报错！

1. 主键的值不可以轻易修改，更不可以通过主键修改主键.
2. 查询数据库中某个字段的个数,使用select count(*) from 表 where 条件
3. 数据库一个表的增删改,可以通过添加触发器实现对第二个表的数据的改动,①如若刚才添加的字段,要在触发器使用,数据库自动封装为字段对象为new,②如若刚才删除的字段,要在触发器使用,数据库自动封装为字段对象old。
   例：

UPDATE littertypenum 
SET littertypenum.typenum = littertypenum.typenum + 1 
WHERE
	littertypenum.typeid =new.typeid

4. 联动俩个表，统计1表的id字段的个数，并且要将此id的值在2表中查询相应的名字，可以使用以下语句。

    SELECT
       COUNT(*) value,
       littertype.typename name
   FROM
       litterrecord,
       littertype
   WHERE
       litterrecord.typeid = littertype.typeid
   GROUP BY
       littertype.typeid

5. ①垃圾投放记录litterrrecord表，存放所有的投放记录，包括记录id、垃圾编号、垃圾投放者、垃圾类别（后续这项可能会去除 冗余）。②垃圾积分表litter③用户表user，包括用户详细信息，以及积分。
   目前要通过litterrecord表中垃圾id编号，去垃圾积分表litter找到这个垃圾的积分，然后在通过投放者id号，找到用户表user，给相应的用户核算分数。注意以下代码是对所有用户的分数进行核算！

 UPDATE `user`
LEFT JOIN 
(
	SELECT
		SUM( B.litterscore ) value,
		B.recorder name 
	FROM
		(
		SELECT
			A.litterid,
			A.recorder,
			litter.litterscore 
		FROM
			( SELECT litterrecord.litterid, litterrecord.recorder FROM litterrecord RIGHT JOIN `user` ON litterrecord.recorder = `user`.id ) A
			LEFT JOIN litter ON A.litterid = litter.litterid 
		) B 
	GROUP BY B.recorder 
	) D 
	ON D.name=`user`.id
	SET `user`.score=D.`value`

这个特别说明以下，left join、inner join、right join三者关系用处 。（链接）

6. 根据用户的积分数值排序后显示,并且知道排名。

SELECT
	a.*,
	@rank := @rank + 1 AS rank_no 
FROM
	( SELECT * FROM `user` ORDER BY score DESC) a,
	( SELECT @rank := 0 ) b

注意：具体使用原理（链接）

7.字段重命名不能以rank
8. IFNULL（exp1，exp2）数据为空，执行exp2，不为空执行exp1。
9.