layui數(shù)據(jù)表格 table.render 報錯的解決方法

發(fā)布時間：2020-09-09 17:47:00 來源：腳本之家閱讀：813 作者：蕭道子欄目：web開發(fā)

一、報錯信息

Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback.

Wed Jan 23 15:20:18 CST 2019
There was an unexpected error (type=Internal Server Error, status=500).
An error happened during template parsing (template: "class path resource [templates/Page/test/test.html]")
org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates/Page/test/test.html]")
	at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:241)
	at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parseStandalone(AbstractMarkupTemplateParser.java:100)
org.springframework.web.filter.HiddenHttpMethodFilter.doFilterInternal(HiddenHttpMethodFilter.java:93)
	at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerRequestFilter.java:107)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:193)
	at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
	at java.lang.Thread.run(Thread.java:748)
Caused by: org.attoparser.ParseException: Could not parse as expression: "
     {field: 'code', width: 80, title: 'ID', sort: true},
     {field: 'name', width: 100, title: '用戶名'},
     {field: 'age', width: 80, title: '年齡'},
     {field: 'gender', width: 80, title: '性別'},
     {field: 'create_time', width: 80, title: '創(chuàng)建時間'},
     {field: 'update_time', width: 80, title: '修改時間'},

    " (template: "Page/test/test" - line 57, col 25)
	at org.attoparser.MarkupParser.parseDocument(MarkupParser.java:393)
	at org.attoparser.MarkupParser.parse(MarkupParser.java:257)
	at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:230)
	... 64 more
Caused by: org.thymeleaf.exceptions.TemplateProcessingException: Could not parse as expression: "
     {field: 'code', width: 80, title: 'ID', sort: true},
     {field: 'name', width: 100, title: '用戶名'},
     {field: 'age', width: 80, title: '年齡'},
     {field: 'gender', width: 80, title: '性別'},
     {field: 'create_time', width: 80, title: '創(chuàng)建時間'},
     {field: 'update_time', width: 80, title: '修改時間'},

    " (template: "Page/test/test" - line 57, col 25)
	at org.thymeleaf.standard.expression.StandardExpressionParser.parseExpression(StandardExpressionParser.java:131)

二、問題處理

根據(jù)官網(wǎng)給出的代碼，我們會發(fā)現(xiàn) cols：屬性后面的參數(shù)“[[ ]] ” ,前后兩個中括號是連在一起的。使用的時候必須把它們分開，不然就會報錯，最好的選擇就是換行，比如像下面這樣

layui數(shù)據(jù)表格 table.render 報錯的解決方法

到這里我們發(fā)現(xiàn)，像這一類的錯誤相對于layui這樣商業(yè)化的框架來說也算是屬于比較”低級“的了。但為什么官方遲遲還不修復(fù)這個BUG呢，原因很簡單因為它和 thymeleaf 沖突。

當(dāng)你的項目采用的是 thymeleaf模板引擎作為前端數(shù)據(jù)鋪顯的時候，你會發(fā)現(xiàn)想要在js 中獲取后端傳入的參數(shù) 必須以這樣的方式取值

layui數(shù)據(jù)表格 table.render 報錯的解決方法

key必須放在 [[ … ]] 中否則無法獲取值，這種語法的語句稱為“內(nèi)聯(lián)”。而這個時候layui 網(wǎng)格加載數(shù)據(jù)的屬性 cols: [[ … ]] 恰好用的也是[[…]，所以thymeleaf會把它當(dāng)做后端的傳入的參數(shù)來進(jìn)行解析，自然就報錯了。

layui數(shù)據(jù)表格 table.render 報錯的解決方法

解決辦法非常簡單,在 script 標(biāo)簽中加入屬性 th:inline=“none”，指定該標(biāo)簽內(nèi)的js 不使用”內(nèi)聯(lián)“獲取參數(shù)。

layui數(shù)據(jù)表格 table.render 報錯的解決方法

如果你需要在js 中獲取后端傳入的參數(shù)，把th:inline="none"改成th:inline="javascript"就可以獲取了

layui數(shù)據(jù)表格 table.render 報錯的解決方法

如果這個時候頁面不報錯，卻沒有數(shù)據(jù)?？赡苁欠祷氐臄?shù)據(jù)格式不正確，必須嚴(yán)格按照官方給出的數(shù)據(jù)格式來封裝

1、table 組件默認(rèn)規(guī)定的數(shù)據(jù)格式為：

{
"code": 0,
"msg": "",
"count": 1000,
"data": [{}, {}]
}

參考數(shù)據(jù)

{
"code": 0,
"msg": "",
"count": 1000,
"data": [
{
"id": 10000,
"username": "user-0",
"sex": "女",
"city": "城市-0",
"sign": "簽名-0",
"experience": 255,
"logins": 24,
"wealth": 82830700,
"classify": "作家",
"score": 57
}
]
}

2、自定義返回數(shù)據(jù)格式，想重新規(guī)定返回的數(shù)據(jù)格式，那么可以借助 response 參數(shù)，如：

table.render({
elem: '#demp'
,url: ''
,response: {
statusName: 'status' //規(guī)定數(shù)據(jù)狀態(tài)的字段名稱，默認(rèn)：code
,statusCode: 200 //規(guī)定成功的狀態(tài)碼，默認(rèn)：0
,msgName: 'hint' //規(guī)定狀態(tài)信息的字段名稱，默認(rèn)：msg
,countName: 'total' //規(guī)定數(shù)據(jù)總數(shù)的字段名稱，默認(rèn)：count
,dataName: 'rows' //規(guī)定數(shù)據(jù)列表的字段名稱，默認(rèn)：data
} 
//,…… //其他參數(shù)
});

那么上面所規(guī)定的格式為：

{
"status": 200,
"hint": "",
"total": 1000,
"rows": []
}

以上這篇layui數(shù)據(jù)表格 table.render 報錯的解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持億速云。

向AI問一下細(xì)節(jié)

layui數(shù)據(jù)表格 table.render 報錯的解決方法

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽