如何动态绑定到组件内部的对象属性？

Question

我正在尝试制作Vue.js检查清单组件：

它将像这样使用：

ListView(
  children: [
    logo,
    buttons,
  ],
)

定义：

<check-list :items="myItems" text-property="name" />

我不想对<template> <div class="form-control item-container"> <div class="custom-control custom-checkbox mr-sm-2" v-for="item in items" :key="item.value"> <input type="checkbox" class="custom-control-input" :id="item.value"> <label class="custom-control-label" :for="item.value">{{item[item.textProperty]}}</label> </div> </div> </template> 属性进行硬编码。如何传入属性名称作为参数，然后动态绑定到模板中的属性名称？

在我上面的示例中，理想情况下，此text应该自动绑定到{{item[item.textProperty]}}。

我想避免使用JavaScript。

Answer 1

应该是：

{{ item[textProperty] }}

属性名称中没有item