如何将变量放入内联javascript[[]]api路径中

Question

我有一个问题，我需要在javasctipt中设置url。但我不知道如何将变量放在th:inline="中；javascript"。我下面的代码：

<script th:inline="javascript">
$(function() {
$('#querySubmit').click(querySubmitClickAction);
querySubmit.addEventListener('click', querySubmitClickAction);
function querySubmitClickAction(e) {

var theSize = 10;
var name = $(this).val();
$.ajax({
url: /* 
[[@{/registeredUserList(type=0,userName=defaultName,page=0,size=10)}]]*/ 'dummy',
type: 'POST',
success: function (data) {
$(".table_content").html(data);
}
})
}
});

如何使用[[]]中的变量来组成url。

url: /*[[@{/registeredUserList(type=0,userName=name,page=0,size=theSize)}]]*/ 'will show error',

它将显示错误。如何使用放入[[]]中的js变量。

非常感谢。

Answer 1

你可以这样做：

<script th:inline="javascript">
/*<![CDATA[*/
// JavaScript variable
var theSize = 10;
// URL from Thymeleaf, note the round brackets to avoid that / becomes /
var theUrl = "[(@{/users/})]";
// Create an URL object resolving the relative url
var url = new URL(theUrl, document.location);
// Update the query parameters of the URL with the JavaScript variables
url.searchParams.append("size", theSize);
console.log(url);
/*]]>*/
</script>

在JavaScript控制台中，这将打印：

http://localhost:3000/users/?size=10