thymeleaf抽取公共html控件复用问题

有时我们需要将html中多次出现的代码抽取出来，使用include进行复用。

<th:block th:include="xxx :: xxx" />

<div th:fragment="xxx">
	<div onclick="testClick()"></div>
	<script>
		function testClick(){
			...
		}
	</script>
</div>

组件不可避免的需要包括一些方法、变量等。同一个页面引入时无法区分这些方法、变量。

引入时传入一个参数来区分

<div th:fragment="xxx(id)">
	<div th:onclick="${id} + 'testClick()'"></div>
	<script th:inline="javascript">
		function [(${id})]testClick(){
			...
		}
	</script>
</div>

这样实际加入页面的代码是

<th:block th:include="xxx :: xxx('happy')" />


	<div onclick="happytestClick()"></div>
	<script>
		function happytestClick(){
			...
		}
	</script>