如何解决内部属性中的插值已被删除。使用v-bind还是结肠速记？

Question

如何解决内部属性中的插值已被删除。使用v-bind还是结肠速记？我的vue组件是这样的：<template>     <div>         <div class="panel-group" v-for="item in list">             ...             <div class="panel-body">                 <a role="button" data-toggle="collapse" href="#purchase-{{ item.id }}" class="pull-right" aria-expanded="false" aria-controls="collapseOne">                     Show                 </a>             </div>             <div id="purchase-{{ item.id }}" class="table-responsive panel-collapse collapse" role="tabpanel">             ...             </div>         </div>     </div></template><script>     export default {         ...         computed: {             list: function() {                 return this.$store.state.transaction.list             },             ...         }     }</script>执行时，会出现如下错误：Vue模板语法错误：id =“purchase - {{item.id}}”：已移除内部属性内插。改为使用v-bind或冒号。我该如何解决？

Answer 1

如果您从src / assets文件夹中提取图像，则需要在对象中包含require（'assets / path / image.jpeg'），就像我在下面所做的那样。

工作范例：

people: [
  {
    name: "Name",
    description: "Your Description.",
    closeup: require("../assets/something/absolute-black/image.jpeg"),
  },

不在你的元素中。