如何使用非可视子组件定义组件属性?

时间:2019-04-20 15:41:07

标签: vue.js vue-component

我已经在vue.js中实现了类似于数据网格的组件(呈现html表,但这并不重要)。用法如下:

<ex-table :header="listHeader" :data="listData" ></ex-table>

其中header是ex-table的数组类型属性,描述网格的所有列(例如eaxample:header文本,如果列是可排序的,可过滤的,则要显示数据的字段)。 / p>

我想更改组件,以便可以像这样使用/定义它:

<ex-table :data="listData">
  <ex-columns>
    <ex-column header="Column1" field="dataField1" sortable="true" filterable="false">
    <ex-column header="Column2" field="dataField2" sortable="true" filterable="true">
    ...
  </ex-columns>
</ex-table> 

换句话说,将列描述为不可见的前列子组件的列表,而不是标题数组,它们只是用来定义网格的外观。

我的问题是:如何获得防爆表中的这些子组件?

我对vue.js很陌生。我已经研究了子组件和插槽,但是它们似乎并不是解决方案。 我只是不知道如何访问ex-table模板/ render方法中的ex-columns,以便可以从那里使用数据(类似于在当前解决方案中使用标头数组)。

0 个答案:

没有答案