基础的配置

页面代码

ibps-card-list基本的配置，图钉控件数据配置的代码展示，整体配置和组件crud类似。

<template>
   <ibps-card-list
    ref="crud"
    :title="title"
    :height="height"
    :data="listData"
    :width="width"
    :pagination="pagination"
    :pk-key="pkKey"
    :toolbars="listConfig.toolbars"
    :search-form="listConfig.searchForm"
    :columns="listConfig.columns"
    :row-handle="listConfig.rowHandle"
    :loading="loading"
    :create-text="createText"
    :identity="identity"
    @action-event="handleAction"
    @sort-change="handleSortChange"
    @pagination-change="handlePaginationChange"
  >
    <template slot="west">
    ... // 左边布局插槽
    </template>
    <template slot="searchForm">
    ... // 搜索栏插槽
    </template>
    <template slot="item-symbol" slot-scope="scope">
    ... // 卡片列表主要展示区域
    </template>
  </ibps-card-list>
</template>

<script>
...
import IbpsCardList from '@/components/ibps-card-list'
...

export default {
  components: {
    ...
    IbpsCardList
    ...
  },
  data() {
    ...
  }
}
</script>

获取内部值和方法

可以通过 ref 拿到地址组件实时数据以及内部方法。

...
this.$refs.crud.getSelectedIds() //获取选中得id组合
...

以上为暂时个例的取值和方法通过ref进行调用，详细的请查看API进行使用。