Setting the path is a common action in thyme leaves.

Replace the self-righteous relative path of the page with a uniform relative root path

For example, there are paths on the page:

<img src=".. /images/hi.png" />
Copy the code

This path, when it really works, is not necessarily correct; Even if it was correct at the time, it may not be correct later as the folder changes. In thyme leaves, we can define paths relative to the root directory:

<! /static/images/hi.png -->
<img th:src="@{/images/hi.png}" />
Copy the code

2. Use the relative root path in JS

<script type="text/javascript" th:inline="javascript">

	let configJSON = (/*[[@{/config.json}]]*/' ') + '? t=' + new Date().getTime();

</script>
Copy the code

{/config.json} is the familiar relative root path, but in JS, it is wrapped in an XML-like comment:

/*[[@{/config.json}]]*/
Copy the code

If it is involved in an operation, it should be enclosed in curly braces:

let configJSON = (/*[[@{/config.json}]]*/' ') + '? t=' + new Date().getTime();
Copy the code

Background variables are part of the path

<link rel="stylesheet" type="text/css" th:href="${pubzy} + '/ arcgis_js_api / 4.10 / esri/CSS/main CSS'" />
Copy the code

Background variable, pubzy. In the background:

    @RequestMapping(value = {"/","/index"}, method = RequestMethod.GET)
    public String getAisBase(Model model) {// Return to the page
        model.addAttribute("pubzy", sysConfig.getPubzy());
        return "map/index";
    }
Copy the code