最近用SpringBoot2.0+Thymeleaf+Layui做了个极简的网站,有空就写这篇博客来说说我在这条小路上踩到的一些坑,坑不大但也是坑啊!
先丢网站: http://lay.putop.top
GitHub: https://github.com/Folgerjun/lay.putop.top
- 首先为什么我用SpringBoot2.0来作为框架,对了,当然是她搭建起来快啊,而且2.0发布也有一段时间了,来熟悉熟悉。
本来准备用druid作为连接池,后来发现2.0她不再用原先的TomcatJDBC了而是采用了Hikari(号称java平台最快连接池),刚好也不用去费时间搭druid配置了
- 第一个坑来了来了,既然选择采用了Hikari那我就简单配置下用户名密码什么的就行了吧,所以我配置文件是这么写的:
spring.datasource.url=jdbc:mysql://localhost:3306/mi_show?useUnicode=true&characterEncoding=utf-8&useSSL=false
spring.datasource.username=root
spring.datasource.password=root
这么一看好像么问题啊,可是运行发现报错,说找不到数据源…
后来我就去springboot官网去看了,不看不晓得啊,发现这么一句:
Also, if you happen to have Hikari on the classpath, this basic setup does not work, because Hikari has no url property (but does have a jdbcUrl property).
可以可以,肥瑞古德!
然后我就看着官网,改了改,OK了,解决!
@Bean
@ConfigurationProperties("spring.datasource")
public DataSource dataSource() {
return DataSourceBuilder.create().build();
}
spring.datasource.jdbc-url=jdbc:mysql://localhost:3306/mi_show?useUnicode=true&characterEncoding=utf-8&useSSL=false
spring.datasource.username=root
spring.datasource.password=root
然后主要是用到了layui的数据表格,这个数据表破用起来是真的挺方便的,layui数据表格在线示例,不过还是要看前后台数据交互格式,这里吃了个小亏没看。所以有问题还是要多去官网看看。
接下来帅了,layer官网 layer作为web弹层组件真是用起来太方便了,而且易上手。完美利用iframe自定义内容、格式。一用我就爱上了她~
首页轮播没有用layui的轮播,因为layui的录播不能自适应,我找了个插件,挺好用的 轮播插件
还有用layer弹出层时遇到个问题,就是不能获取弹出层的值,后也是通过网络看了别人也是这种情况然后试了试一个老哥的方法,成了。先在弹出层中写个返回数据方法,然后再通过点击按钮,yes回调方法来获取。如下示例:
var callbackdata = function () {
var miName = $("#miName").val();
var miType = $("#miType").val();
var miDes = $("#miDes").val();
var miUrl = $("#miUrl").val();
var data = {
miName: miName,
miType: miType,
miDes: miDes,
miUrl: miUrl
};
return data;
}
// 点击新增按钮
$('#addMi').on('click', function() {
layer.open({
type: 2,
title: '新增',
area: ['500px', '400px'],
content: '/form',
btn: ['提交','取消'],
yes: function(index){
// 从弹出框中获取数据
//当点击‘确定’按钮的时候,获取弹出层返回的值
var res = window["layui-layer-iframe" + index].callbackdata();
//打印返回的值,看是否有我们想返回的值。
var miName = res.miName,
miType = res.miType,
miDes = res.miDes,
miUrl = res.miUrl;
console.log(miName + ' ' + miType + ' ' + miDes + ' '+ miUrl);
其余的也就没什么大毛病了,总之遇到问题求助网络,去看官网,然后发现那都不是问题。
代码虽然没几行,不过挺适合初学者练练手的。GitHub地址贴上面了,去吧,别客气!