2
0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-19 09:50:33 +03:00

better install instructions in readme

This commit is contained in:
Jeff Sagal
2017-02-04 20:06:51 -08:00
parent 4056466cff
commit 37ffabf25e
+25 -22
View File
@@ -10,6 +10,7 @@
- Select Single/Multiple Options - Select Single/Multiple Options
- Bootstrap Friendly Markup - Bootstrap Friendly Markup
- +95% Test Coverage - +95% Test Coverage
- ~32kb minified
## Documentation ## Documentation
- **[Demo & Docs](http://sagalbot.github.io/vue-select/)** - **[Demo & Docs](http://sagalbot.github.io/vue-select/)**
@@ -18,52 +19,54 @@
## Install & Basic Usage ## Install & Basic Usage
#### Vue Compatibility #### Vue Compatibility
- `vue-select ~2.0` is compatible with `vue ~2.0` - `vue ~2.0` use `vue-select ~2.0`
- `vue-select ~1.0` is compatible with `vue ~1.0` - `vue ~1.0` use `vue-select ~1.0`
#### NPM ## NPM
Install the package. _You should install `vue-select@1.3.3` for use with vue `~1.0`._
```bash ```bash
$ npm install vue-select $ npm install vue-select
``` ```
```html Register the component
<template>
<div>
<v-select v-model="select" :options="options"></v-select>
</div>
</template>
<script> ```js
import Vue from 'vue'
import vSelect from 'vue-select' import vSelect from 'vue-select'
export default { Vue.component(vSelect)
components: {vSelect},
data() {
return {
selected: null,
options: ['foo','bar','baz']
}
}
}
</script>
``` ```
#### CDN/Browser Globals You may now use the component in your markup
```html
<v-select v-model="selected" :options="['foo','bar']"></v-select>
```
## CDN
Just include `vue` & `vue-select.js` - I recommend using [unpkg](https://unpkg.com/#/). Just include `vue` & `vue-select.js` - I recommend using [unpkg](https://unpkg.com/#/).
```html ```html
<script scr="https://unpkg.com/vue@latest"></script>
<!-- use the latest release --> <!-- use the latest release -->
<script src="https://unpkg.com/vue-select@latest"></script> <script src="https://unpkg.com/vue-select@latest"></script>
<!-- or point to a specific release --> <!-- or point to a specific release -->
<script src="https://unpkg.com/vue-select@1.3.3"></script> <script src="https://unpkg.com/vue-select@1.3.3"></script>
``` ```
Then register the component in your javascript: Then register the component in your javascript:
```js ```js
Vue.component('v-select', VueSelect.VueSelect); Vue.component('v-select', VueSelect.VueSelect);
``` ```
From there you can use as normal. Here's an [example on JSBin](http://jsbin.com/saxaru/5/edit?html,js,output). You may now use the component in your markup
```html
<v-select v-model="selected" :options="['foo','bar']"></v-select>
```
Here's an [example on JSBin](http://jsbin.com/saxaru/5/edit?html,js,output).
### For more information, please visit the [vue-select documentation.](https://sagalbot.github.io/vue-select) ### For more information, please visit the [vue-select documentation.](https://sagalbot.github.io/vue-select)