我正在使用Sping Boot 和Thymeleaf以及一些vanilla JavaScript。在我的JavaScript中，我有一个字符串数组，如下所示：

var tags = ["ramen", "japanese"];

我想使用JavaScript在这个数组中动态添加/删除项目，然后再提交到后端。用户可以添加0.. * 标记。
数据只能通过HTMLx 1 m0n1x提交到后端，还有一个model属性可以将这些细节从HTML表单捕获到Spring中，称为VenueForm。

<form id="tag-form" class="form" method="POST" th:object="${venueForm} th:action="/venue/tag">

VenueForm.java

public class VenueForm {
    private List<String> tags;
    private Object otherStuff;
    ...
    // Getters and Setters
}

VenueController.java

@Controller
@RequestMapping("/venue/tag")
public class VenueController {

    @PostMapping
    public String createVenue(@ModelAttribute VenueForm venueForm){
       List<String> tags = venueForm.getTags();
       System.out.printLn(tag);
       return "tags"
    }
}

如何将JavaScript数组tags赋给Thymeleaf表单列表字段tags？
通常输入来自th:field="*{tags}"的输入字段，但因为它是一个数组，我不知道如何实现这一点。任何帮助将不胜感激。请注意，jQuery不是一个选项，只有香草JS。
我曾尝试停止使用JS提交HTML表单，然后使用JS分配输入字段，但没有工作。

<input type="submit" value="Submit" th:onsubmit="submitForm(event)">

main.js

function submitForm(event){
    event.preventDefault();
    venueTagInput.value = JSON.stringify(tags);
    console.log("sumitting...");
}