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

我正在尝试制作Vue.js检查列表组件：

它的使用方式如下：

<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>

{{item[item.textProperty]}

我不想硬编码

文本

属性。如何传入要用作参数的属性名，然后动态绑定到模板中的属性名

在我上面的示例中，这个

{{item[item.textProperty]}

理想情况下应该自动绑定到

item['name']

我希望避免使用javascript。

应该是：

{{ item[textProperty] }}

---

如果属性名称中没有

item

，则应该是

{{item[textProperty]}

@fabruex，谢谢！