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

Question

例如，这将引发Vue错误：

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

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

从Vue的警告中尚不清楚我该怎么办。

有什么主意吗？

Answer 1

感谢德里克（参见上面的评论），正确的答案是：

driver.findElement(By.xpath("/html/body/div[10]"));

请注意以下几点：

• :src="'<?= get_stylesheet_directory_uri(); ?>/images/' + form.screw.drive_image" 是:src的简写
• v-bind:src是<?=的简写
• 在这种情况下，Vue的数据不需要大括号
• Vue道具中的计算是JavaScript，因此在：src中，我们使用<?php echo [...]进行连接

Answer 2

您可以使用文档中的v-bind shorthand：

  

动态地将一个或多个属性或组件属性绑定到表达式。

格式：

<img :src="'some_string' + some_data">

最终产品：

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

Answer 3

您应该使用

<img v-bind:src="form.screw.drive_image" />

并更改 form.screw.drive_image 的值以包含 get_stylesheet_directory_uri（）