javascript - 如何在html属性中写入Vue数据？

Question

例如，这将抛出一个 Vue 错误:

<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/{{ form.screw.drive_image }}" >

我正在 src prop 中编写 {{ form.screw.drive_image }}。

从 Vue 的警告中看不清楚我应该如何解决。

有什么想法吗？

Answer 1

感谢 Derek(见上面的评论)，正确答案是:

:src="'<?= get_stylesheet_directory_uri(); ?>/images/' + form.screw.drive_image"

请注意以下事项:

• :src是 v-bind:src 的简写
• <?=是 <?php echo [...] 的简写
• 在这种情况下，Vue 的数据不需要大括号
• Vue 的 props 中的计算是 javascript，所以在 :src 中我们使用 +连接