Vuejs2 将变量传递到vue js

Thymeleaf th:attr不使用Vue绑定属性

<truncate th:attr="'v-bind:text'=${message}"/>

上面的一行没有给出Vue和ThymileAF中的错误，但在第页上没有显示任何内容

下面是服务器端的响应

一旦我删除'v-bind:'前缀并使用类似于“th:attr=“text=${user.comment}”的东西，它就会正常工作

<div class="col-lg-12 col-sm-12 col-xs-12 row_block_padding" th:each="user : ${response.users}">

    <!-- OTHER CODE -->
    <div class="col-lg-10 col-sm-10 col-xs-10" style="padding-top: 15px;">
        <truncate th:attr="text=${user.comment}"></truncate>
    </div>
</div>  

---

您需要使用

th:attr

指令。例如

<div th:with="message='Simple message'">
  <truncate th:attr="'v-bind:text'=${message}"/>
</div>

您可能会注意到，这不是一个有效的Vue绑定表达式，因此您可能实际上不想使用绑定，而是使用

<truncate th:attr="text=${message}"/>

那会产生什么

<truncate text="Simple message"/>

vue的解决方案：v-bind的另一种用法

---

Thymeleaf的哪个版本？Thymeleaf 3.0.9.Release上面的语句出现以下错误：org.Thymeleaf.exceptions.TemplateProcessingException:无法作为分配序列进行分析：“v-bind:text=${message}”“@PankajPatel啊，哎呀。这就是我没有测试的原因。请查看我的最新答案不幸的是，它也不起作用。我用Thymeleaf 3.0.9.RELEASE测试了@PankajPatel，它给了我预期的输出，效果很好。请您更新问题中的代码以匹配您当前拥有的代码，好吗？当前代码正在运行：

<truncate text="Simple message"/>

<truncate th:attr="'v-bind='{text:'+${message}+'}'"/>