# vue-search-paginate-b4

> un champ de recherche avec pagination en vue.js

Latest version **0.0.1** (published 2021-03-01) · 0 weekly downloads

## Install

```sh
npm install vue-search-paginate-b4
pnpm add vue-search-paginate-b4
yarn add vue-search-paginate-b4
bun add vue-search-paginate-b4
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2021-03-01 |
| First published | 2021-03-01 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 159.7 KB |
| Known vulnerabilities | 0 (+23 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | pierro5487 |

## Links

- npm: https://www.npmjs.com/package/vue-search-paginate-b4
- npm.io page: https://npm.io/package/vue-search-paginate-b4

## Dependencies (1)

- [axios](https://npm.io/package/axios.md) ^0.21.1

## Recent versions

- 0.0.1 (latest) — 2021-03-01

## README

# form-builder

## publication composant
#### installation pour build
```
./develop npm i
```
#### build
```
./develop npm run build
```
#### publish to npm
modifier la version dans package.json.

!!etre loggué sur npm
```
./develop npm publish
```

## tester

#### instalation
```
./develop app install
```
```
cp .env.dev .env 
```

#### démarrage
```
./develop up app -d
```

## doc

### installation

```
import Search from 'SearchPaginate';
```
```

Vue.component('search-paginate',Search);
```

```
<search-paginate v-model=mon model"" :options="options"></search-paginate>
```

### les options

####label
```
default : false
type : string|booleen
```

####id
```
default : 'search-paginate'
type : string
```

####displayedItem
```
default : 5
type : number
```

####labelField
```
-> champ à afficher dans la liste des resultats
-> champ qui sera affiché dans champ de recherche après selection
default : label
type : string|function

ex:
labelField: 'first_name' // retournera le champ first_name de l'élément selectionné
labelField: function(item){ 
       return item.first_name + ' ' + item.name
  }

```

####withDeleteButton
```
default : true,
type : booleen
```


### Affichage customisé des listes
```
<search-paginate :options="options" v-model="test">
    <template v-slot:list-item="{item}">
         <div class="d-flex justify-content-between">
               <div>{{ item.first_name }}</div>
               <div>{{ item.id }}</div>
         </div>
    </template>
</search-paginate>
```

---
_Source: https://npm.io/package/vue-search-paginate-b4 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._