|
10 | 10 | - Select Single/Multiple Options |
11 | 11 | - Bootstrap Friendly Markup |
12 | 12 | - +95% Test Coverage |
| 13 | +- ~32kb minified |
13 | 14 |
|
14 | 15 | ## Documentation |
15 | 16 | - **[Demo & Docs](http://sagalbot.github.io/vue-select/)** |
|
18 | 19 | ## Install & Basic Usage |
19 | 20 |
|
20 | 21 | #### Vue Compatibility |
21 | | -- `vue-select ~2.0` is compatible with `vue ~2.0` |
22 | | -- `vue-select ~1.0` is compatible with `vue ~1.0` |
| 22 | +- `vue ~2.0` use `vue-select ~2.0` |
| 23 | +- `vue ~1.0` use `vue-select ~1.0` |
23 | 24 |
|
24 | | -#### NPM |
| 25 | +## NPM |
| 26 | +Install the package. _You should install `vue-select@1.3.3` for use with vue `~1.0`._ |
25 | 27 |
|
26 | 28 | ```bash |
27 | 29 | $ npm install vue-select |
28 | 30 | ``` |
29 | 31 |
|
30 | | -```html |
31 | | -<template> |
32 | | - <div> |
33 | | - <v-select v-model="select" :options="options"></v-select> |
34 | | - </div> |
35 | | -</template> |
| 32 | +Register the component |
36 | 33 |
|
37 | | -<script> |
| 34 | +```js |
| 35 | +import Vue from 'vue' |
38 | 36 | import vSelect from 'vue-select' |
39 | | -export default { |
40 | | - components: {vSelect}, |
41 | | - data() { |
42 | | - return { |
43 | | - selected: null, |
44 | | - options: ['foo','bar','baz'] |
45 | | - } |
46 | | - } |
47 | | -} |
48 | | -</script> |
| 37 | +Vue.component(vSelect) |
| 38 | +``` |
| 39 | + |
| 40 | +You may now use the component in your markup |
| 41 | + |
| 42 | +```html |
| 43 | +<v-select v-model="selected" :options="['foo','bar']"></v-select> |
49 | 44 | ``` |
50 | 45 |
|
51 | | -#### CDN/Browser Globals |
| 46 | +## CDN |
52 | 47 |
|
53 | 48 | Just include `vue` & `vue-select.js` - I recommend using [unpkg](https://unpkg.com/#/). |
54 | 49 |
|
55 | 50 | ```html |
| 51 | +<script scr="https://unpkg.com/vue@latest"></script> |
56 | 52 | <!-- use the latest release --> |
57 | 53 | <script src="https://unpkg.com/vue-select@latest"></script> |
58 | 54 | <!-- or point to a specific release --> |
59 | 55 | <script src="https://unpkg.com/vue-select@1.3.3"></script> |
60 | 56 | ``` |
| 57 | + |
61 | 58 | Then register the component in your javascript: |
62 | 59 |
|
63 | 60 | ```js |
64 | 61 | Vue.component('v-select', VueSelect.VueSelect); |
65 | 62 | ``` |
66 | 63 |
|
67 | | -From there you can use as normal. Here's an [example on JSBin](http://jsbin.com/saxaru/5/edit?html,js,output). |
| 64 | +You may now use the component in your markup |
| 65 | + |
| 66 | +```html |
| 67 | +<v-select v-model="selected" :options="['foo','bar']"></v-select> |
| 68 | +``` |
| 69 | + |
| 70 | +Here's an [example on JSBin](http://jsbin.com/saxaru/5/edit?html,js,output). |
68 | 71 |
|
69 | 72 | ### For more information, please visit the [vue-select documentation.](https://sagalbot.github.io/vue-select) |
0 commit comments