中文字符的分页模糊查询

本项目采样springboot+Vue+Mybatis-plus+MySql框架
1、设置数据库
数据表的格式设置成utf8

2、后台处理
Map接口

public interface RoleMapper extends BaseMapper<Role> {
    @Select("SELECT * FROM campus_helper.role r where r.name like '%${name}%'")
    List<Role> getRoleByName(Page<Role> page, @Param("name") String name);
}

服务接口

public interface RoleService extends IService<Role> {
    Page<Role> getRoleByName(Page<Role> page, String name);
}

服务类

@Service
public class RoleServiceImpl extends ServiceImpl<RoleMapper, Role> implements RoleService {
    public Page<Role> getRoleByName(Page<Role> page, String name){
        return page.setRecords(this.baseMapper.getRoleByName(page, name));
    }
}

控制类

@PostMapping("/query")
    public BaseResponse<?> query(int start, String query, int pageNum, int pageSize){
        Page<Role> page=new Page<>(pageNum, pageSize);
        Page<Role> roleList=roleService.getRoleByName(page, query.trim());
        return (new BaseResponse<>()).Result(Constants.SUCCESS,roleList,"success");
    }

3、前端处理
template模板

<el-input v-model="queryInfo.query" placeholder="请输入内容">
          <el-button slot="append" icon="el-icon-search" @click="onSearch"></el-button>
</el-input>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                   :current-page="queryInfo.pageNum" :page-sizes="[1, 2, 3, 4]"
                   :page-size="queryInfo.pageSize" :total="total"
                   layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>

数据

queryInfo: {
        start: 0,
        query: '',
        pageNum: 0,
        pageSize: 2
      },

js方法

onSearch () {
      this.queryInfo.start = 1
      this.getRoleList()
    },

4、问题解决
查询不可靠，有时可以魔化查询，有时不行
将当前页指名为首页问题解决。

onSearch () {
      this.queryInfo.start = 1
      this.queryInfo.pageNum = 0
      this.getRoleList()
    },