https://github.com/onewaytech/vue-select2-component

Select2 encapsulation for Vue 1.x
https://github.com/onewaytech/vue-select2-component

select2 vue

Last synced: 3 days ago
JSON representation

Select2 encapsulation for Vue 1.x

• Host: GitHub
• URL: https://github.com/onewaytech/vue-select2-component
• Owner: OneWayTech
• Created: 2016-12-29T08:59:27.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2017-04-10T03:08:04.000Z (over 7 years ago)
• Last Synced: 2024-12-23T18:13:26.037Z (10 days ago)
• Topics: select2, vue
• Language: Vue
• Size: 4.88 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Vue Select2 Component

[![npm version][npm-v-img]][npm-url]

[![npm download][npm-dl-img]][npm-url]

> Intellectual property of [Oneway.mobi](http://www.oneway.mobi/)

#### Requirement

* Vue 1.x

* jQuery ( available globally )

* [Select2](https://github.com/select2/select2)

#### Installation

`npm i vue-select2-component -S`

> alternatively: ``  

> which exposes **`VueSelect2`** as a global variable

#### Example

See [here](https://onewaytech.github.io/vue-select2-component/example.html), source in [`example.html`](./example.html)

> I prefer inspecting it with [devtools](https://github.com/vuejs/vue-devtools)

#### Configuration

* `@prop {String/String[]} model (.sync!)`, defaults to `''`

* `@prop {String} models (.sync!)`, defaults to `''`

* `@prop {Object[]} options (required!)`, **must** in `[{ value: {String/Number}, text: {String} }]` pattern

* `@prop {Object} config`, defaults to `{}`. Besides the [basic configuration](http://select2.github.io/options.html) of Select2, we have some extra settings:

  * `multiple`: defaults to `undefined` ( Meaning default as a single select )

  * `width`: defaults to `100%`

  * `delimiter`: defaults to `,` ( Only for multiple select )

  * `showValInText`: defaults to `undefined`. If set to `true`, the render result would be:  

```

    

      (1) Apple

      (2) Banana

      ...

    

```

#### Build

`npm run build`

[npm-url]: https://www.npmjs.com/package/vue-select2-component

[npm-v-img]: http://img.shields.io/npm/v/vue-select2-component.svg

[npm-dl-img]: http://img.shields.io/npm/dm/vue-select2-component.svg