# vue-hierarchical-select

> a vue hierarchical select plugin for vue2

Latest version **1.0.4** (published 2022-05-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-hierarchical-select
pnpm add vue-hierarchical-select
yarn add vue-hierarchical-select
bun add vue-hierarchical-select
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2022-05-05 |
| First published | 2018-04-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 68.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | WDDA |
| Maintainers | wdda |
| Keywords | vue2, hierarchical select |

## Links

- npm: https://www.npmjs.com/package/vue-hierarchical-select
- Repository: https://github.com/wdda/vue-hierarchical-select
- Homepage: https://github.com/wdda/vue-hierarchical-select#readme
- Issues: https://github.com/wdda/vue-hierarchical-select/issues
- npm.io page: https://npm.io/package/vue-hierarchical-select

## Alternatives

- [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads
- [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads
- [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads
- [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads
- [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2022-05-05
- 1.0.3 — 2022-05-04
- 1.0.2 — 2018-04-18
- 1.0.1 — 2018-04-05
- 1.0.0 — 2018-04-04

## README

# vue-hierarchical-select

A Hierarchical select plugin for vue2

##  DEMO

[http://wdda.github.io/vue-hierarchical-select/demo](http://wdda.github.io/vue-hierarchical-select/demo)

##  NPM

```bash
    npm install vue-hierarchical-select
```

##  ES6

```javascript
    import HierarchicalSelect from  'vue-hierarchical-select'
	
    new Vue({
      components: {
        HierarchicalSelect
      }
    })
```

## Usage

```html
    <div id="app">
        <hierarchical-select :nodes="nodes"></hierarchical-select>
    </div>
    
   <script>
      new Vue({
        el: '#app',
        data: {
          nodes: [
            {
              name: 'test1',
              id: 2,
              children: [
                {name: 'test2', id: 3},
                {name: 'test3', id: 4},
              ]
            }
          ],
        }
      })
    </script>
```

## API

| Props               | Type               | Default                 | Description                                                                                    |
|---------------------|--------------------|-------------------------|------------------------------------------------------------------------------------------------|
| nodes               | Array              |                         | Tree of data                                                                                   |
| selected            | String  or  Number | null                    | Selected value                                                                                 |
| name                | String             | name[]                  | Input name                                                                                     |
| option-value        | String             | id                      |                                                                                                |
| option-name         | String             | name                    |                                                                                                |
| option-name-default | String             | - choice -              |                                                                                                |
| css-classes         | Array  or  Object  | vue-hierarchical-select | For input element                                                                                  |
| css-styles          | String             | null                    | For input element                                                                              |
| onlyLast            | Boolean            | false                   | Return only last selected option                                                               |
| transitionName      | String             | null                    | Name of transition classes                                                                     |
| maxColumnWidth      | Number             | 10000                   | max-width for change direction to 'row' or 'column', where 0 is only row and 10000 only column |


## Methods

| Method        | Params        |
| ------------- |:-------------:|
| changeSelect      | value |


## License

Licensed under the [MIT license](https://opensource.org/licenses/mit-license.php).

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