spring boot thymeleaf 对于不同的@GetMapping 路径意外的不同渲染

Question

我目前正在玩spring-boot-bootstrap-thymeleaf-tree-table 我正在将代码迁移到我的 spring-boot 项目中，一切顺利。但是，如果我更改 @GetMapping 路径以将 @PathVariable 传递给 thymeleaf 页面，则渲染会发生变化。

我的控制器：

@Controller
public class NodesController {
    
    @GetMapping("/user/object/{identifier}")
    public String nodes(@PathVariable String identifier, Model model) {
        return "objectDetails";
    }
    
    
    @GetMapping("/nodes")
    public String nodes2(Model model) {
        return "objectDetails";
    }    
}

两种映射/方法都使用相同的模板。但是'nodes2'效果很好，'nodes'不行。

“nodes2”路径的预期结果：@GetMapping("/nodes")

带有“节点”路径的损坏结果：@GetMapping("/user/object/{identifier}")

模板：

<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>Object details</title>
    <th:block th:include="head :: head"/>
    <link th:rel="stylesheet" th:href="@{assets/jquery-treetable/jquery.treetable.css}"/>
    <link th:rel="stylesheet" th:href="@{assets/jquery-treetable/jquery.treetable.theme.default.css}"/>
    <link th:rel="stylesheet" th:href="@{webjars/bootstrap/4.0.0-2/css/bootstrap.min.css} "/>
</head>
<body>
<div th:replace="menu :: menu"></div>
<div class="container-fluid">
    <div class="row">
        <div class="col mt-5">

            <table id="treeTable" class="table">
                <thead>
                <tr>
                    <th>Subject</th>
                    <th>Predicate</th>
                    <th>Object</th>
                </tr>
                </thead>
            </table>

        </div>
    </div>

</div>

<script th:src="@{/webjars/jquery/jquery.min.js}"></script>
<script th:src="@{/webjars/popper.js/umd/popper.min.js}"></script>
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/assets/jquery-treetable/jquery.treetable.js}"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $.ajax({
            "type": 'get',
            "url": '/tree/9d317daca74246d4be41b1a37e30ee2a',
            "dataType": "json",
            "success": function (data) {
                $.each(data, function (idx, obj) {
                    $("#treeTable").append("<tr data-tt-id=\"" + obj.nodeId + "\" data-tt-parent-id=\"" + obj.parent + "\"><td>" + obj.subjectShort + "</td><td>" + obj.predicate + "</td><td>" + obj.object + "</td></tr>");
                });
                $("#treeTable").treetable({
                    expandable: true,
                    initialState: "expanded",
                    clickableNodeNames: true,
                    indent: 30
                });
            }
        });
    });
</script>

</body>
</html>

Answer 1

因为有了GetMapping，加载js资源的路径变了！

localhost:8080/user/object/assets/

代替

localhost:8080/assets/

通过更改链接解决：

<link th:rel="stylesheet" th:href="@{assets/jquery-treetable/jquery.treetable.css}"/>

至：

<link th:rel="stylesheet" th:href="@{../../assets/jquery-treetable/jquery.treetable.css}"/>

感谢@andrewJames 的提示！

spring boot thymeleaf 对于不同的@GetMapping 路径意外的不同渲染

问题描述投票：0回答：1

1个回答

最新问题

spring boot thymeleaf 对于不同的@GetMapping 路径意外的不同渲染

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1