结合弦乐和弦乐Vue组件模板

Question

我有一个表单，我有1个客户端或2个客户端。我创建了一个用于选择计数的组件，另一个用于显示客户信息表单（如果有2个客户端，则使用v-for，2个表单）。

<div id="root">
   <count-section></count-section> // also emits the client count
   <infos
      v-for="(count, index) in total"
      :key="index"
      v-bind:index="count">
   </infos>
</div>

在设置道具后，我可以抓住组件中的count。

在innerhtml中，这个正在工作：

<h5>Person {{ count }} Info</h5>

然后我尝试生成一个组合字符串的属性，它给了我错误。

<input name="name-client-{{count}}"

  

name =＆＃34; name-client - {{count}}＆＃34;：已移除内部属性内插。改为使用v-bind或冒号。例如，而不是使用。

实现它的正确方法是什么？我是否以错误的方式思考流程？我想将name-client-1和name-client-2一起作为所有其他具有相同结构的字段的集合，并在后端使用for-loop。

Answer 1

使用 ES6 模板字符串 :name="`name-client-${count}`"。