Пишу велосипед - компонент для отображения грида.
grid.vue:
<tbody>
<tr v-for="entry in filteredData"
@click="toggleSelected(entry._id, $event)"
:class="{ selected: selected.indexOf(entry._id) !== -1 }">
<td v-for="key in columns">
{{ entry[key['name']] }}
</td>
</tr>
</tbody>
goods.vue:
const gridColumns = [
{ name: 'sku', sortable: true, label: 'SKU' },
{ name: 'price', sortable: true },
{ name: 'inStock', label: 'Available' }
]
Например, последняя колонка - это true / false. Хочется показать соответственно отмеченный / неотмеченный чекбокс. Логика подсказывает сделать что-то вроде
{ name: 'inStock', label: 'Available', template: '<input type="checkbox" {{ entry[key["name"] == true ? 'checked' : '' }}' }
В ui-grid, который к AngularJS, что-то похожее было.
Не могу понять, как мне в родительском компоненте, если существует
key['template']
- рендерить его содержимое, а если нет -
{{ entry[key['name']] }}
?