springboot+layui+thmleaf开发遇到的坑

大四找到工作之后就一直在寝室苟着,很多开发的技巧和tips都忘了,上周特地重新写了一个springboot的项目,很简单,增删查改,登陆注册,管理员权限,将数据传递到前端,对每特定的数据进行展示和评论等,总之就是一个练手的项目,但也遇到了很多的坑,特总结如下

如何访问templates下的静态资源**

在这里插入图片描述
新建工具类如下,即可访问templates下的index,别名为login.html

public class MyConfig implements WebMvcConfigurer {

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("login.html").setViewName("index");
        }
}

如何访问pom中的webjar依赖**

还是图1中的类,重写方法
这样就可以在页面中引用前端资源,例如layui,vue的jar包,否则访问会报错(可能还有其他的方法访问webjar,欢迎大家讨论)

@Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/webjars/**") .addResourceLocations("classpath:/META-INF/resources/webjars/");

    }

常用的注释

@Configuration:定义配置类,暂时只在WebMvcConfigurer的实现类下使用
@Controller:定义控制层
@RequestMapping(“dis”) 访问控制层方法的路径,可用在方法和类上
@Autowired:自动注入
@ResponseBody:方法的返回值是不再是资源路径,而是 json格式的字符串
在这里插入图片描述

@Mapper:定义dao层(注解开发还要用到@Select,@Update,@Insert,@Delete)
@Service:定义service层
@PathVariable 常用于在控制层

@RequestMapping("/text/{id}")
public String text01(@PathVariable("id") Integer id){
		.....
}

可以把text01的参数传到@RequestMapping映射的路径中

@SpringBootApplication:项目主类,启动项目用(一般不用自己写)

前端编写注意事项

οnblur="f1()"当控件失去焦点时,调用f1方法()
required 必填项,常配合input使用
我比较作死,前期用的bootstrip,后来改的layui,如果一个页面引入了这两个包,emmmm自行体会吧
5. json和ajax的使用
json:一种键值对的格式,对象用{},数组用[]
ajax:

 function f1(){
            $.get("/user/name",{"na":$("#name").val()},function (data) {
                if(data.toString()==0){
                    $("#g").css("color","red")
                    window.alert(data);
                }
                $("#pp").html=(data);
            })
        }
上述代码就是ajax的使用,判断注册的用户名是否重复
get的()三个参数,第一个是请求路径,第二个是要验证的字符串(#name是找前端id为name的控件,.val()是获取控件的值,fun(data是获取后台返回的json数据))

layui和bootstrip的区别,layui的优势

我个人感觉,layui更美观,更适合不咋会前端开发的后端开发者,比如我

layui表格需要的数据格式

layui动态表格要接收一个json格式的数据,但和@ResponseBody返回的json略有差异,这个时候我们要用到一个工具类进行一下转化

public class LayuiTypeJson<T> {
    private int code=0;
    private String msg="";
    private int count;
    private List<T> data=new ArrayList<T>();

    public int getCode() {
        return code;
    }

    public void setCode(int code) {
        this.code = code;
    }

    public String getMsg() {
        return msg;
    }

    public void setMsg(String msg) {
        this.msg = msg;
    }

    public int getCount() {
        return count;
    }

    public void setCount(int count) {
        this.count = count;
    }

    public List<T> getData() {
        return data;
    }

    public void setData(List<T> data) {
        this.data = data;
    }
}

应用如下

 @RequestMapping("list")
 @ResponseBody
    public LayuiTypeJson<Ngrade> findAll(){
        List<Ngrade> all = dao.findAll();
        LayuiTypeJson<Ngrade> json = new LayuiTypeJson<>();
        json.setCount(all.size());
        json.setData(all);
        return json;
    }

注意一下,返回值类型是LayuiTypeJson

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值