2.0.3 • Published 3 years ago
em-grid-card-items v2.0.3
em-grid-card-items
Card grid
Install
npm install --save em-grid-card-items
Add to project
Global
#stylesheet.css
Vue.use options
// main.js
import EmGridCardItems from 'em-grid-card-items'
Vue.use(EmGridCardItems)
Local Usage
<template>
<div>
<em-grid-card-items
:column-count="5"
:column-spacing="10"
:row-spacing="10"
:is-add-mode-item="false"
mode="add"
resource-name="products"
item-prop-name="product"
em-card-type="EmCardProduct"
:off-direction="false"
:card-props="{isEditMode: true}"
@action=""
/>
<em-grid-card-items
:column-count="5"
resource-name="products"
item-prop-name="product"
em-card-type="EmCardProduct"
:card-props="{isEditMode: true}"
@action=""
/>
</div>
</template>
<script>
export default {
name: 'component.vue',
}
</script>
Setup
Parameters
Props(Parameter) | Type | Default | Description |
---|---|---|---|
column-count | Number | 0 | Number of speakers |
column-spacing | Number | 20 | Distance between columns of elements |
row-spacing | Number | column-spacing | Distance between rows of elements, if 0 or not set column-spacing is used |
resource-name | String | null | The api path of the resource on the backend |
resource-prefix | String | null | Resource api path prefix on backend |
resource-params | Object | {} | The object of the parameters passed in the request to the api of the resource on the backend |
item-prop-name | String | null | The name of the parameter by which the object is passed to the component |
card-props | Object | null | Additional parameters passed to the object in the component |
em-card-type | String | null | Component name |
off-direction | Boolean | false | Column distribution is done by flex-wrap, column-count is ignored |
is-add-mode-item | Boolean | false | Whether to show the card in the mode of adding elements |
check-list | Array | [] | Array for storing selection of elements |
mode | String | padination ,add | Resource loading mode |
is-dark-button | Boolean | false | Show more button type true? 'Primary': 'warning' |