開發工具：Ideal
使用場景：Demo
前提：
環境：Spring boot +Thymeleaf+easyui
引入thymeleaf模板引擎
1 <html lang="en" xmlns:th="http://www.thymeleaf.org"> 2 Html頁面引入easyui需要的文件 3 4 <link href="/js/jquery-easyui-1.5.3/themes/gray/easyui.css" rel="stylesheet"/> 5 6 <link href="/js/jquery-easyui-1.5.3/themes/icon.css" rel="stylesheet"/> 7 8 <script src="/js/jquery-easyui-1.5.3/jquery.min.js"></script> 9 10 <script src="/js/jquery-easyui-1.5.3/jquery.easyui.min.js"></script> 11 12 <script src="/js/jquery-easyui-1.5.3/locale/easyui-lang-zh_CN.js"></script>
當以標簽屬性創建easyui組件時，頁面正常顯示。
以標簽屬性創建easyui組件：
1 <table class="easyui-datagrid" title="Basic DataGrid" style="width:700px;height:250px" 2 3 data-options="singleSelect:true,collapsible:true,url:'/getUsers',method:'get'"> 4 5 <thead> 6 7 <tr> 8 9 <th data-options="field:'id',width:80">Item ID</th> 10 11 <th data-options="field:'name',width:100">姓名</th> 12 13 <th data-options="field:'tel',width:80,align:'right'">電話</th> 14 15 </tr> 16 17 </thead> 18 19 </table>
頁面效果：
當以js形式創建組件時出現問題
以js創建easyui組件
1 <table id="dg"></table> 2 3 <script type="text/javascript"> 4 5 $(function(){ 6 7 $('#dg').datagrid({ 8 9 url: '/getUsers', 10 11 method: 'get', 12 13 title: '用戶表', 14 15 iconCls: 'icon-save', 16 17 width: 800, 18 19 height: 250, 20 21 fitColumns: true, 22 23 singleSelect: true, 24 25 columns:[[ 26 27 {field:'id',title:'Item ID',width:80}, 28 29 {field:'name',title:'姓名',width:80}, 30 31 {field:'tel',title:'電話',width:80} 32 33 ]] 34 35 }); 36 37 }); 38 39 </script>
效果：
后台報以下錯誤：
[THYMELEAF][http-nio-8080-exec-1] Exception processing template "user": Could not parse as expression: "
{field:'id',title:'Item ID',width:80},
{field:'name',title:'姓名',width:80},
{field:'tel',title:'電話',width:80}
" (template: "user" - line 26, col 27)
解決方式：
將
1 <script type="text/javascript" >
改為
1 <script type="text/javascript" th:inline="none">
總結：
在easyui頁面中,script執行easyui自己的方法要加入:
1 <script th:inline="none">
原文參考：https://blog.csdn.net/xlzwhq0000004/article/details/83144440