├── .eslintignore ├── .gitignore ├── .babelrc ├── examples ├── main.js ├── index.html └── App.vue ├── src ├── index.js ├── assets │ ├── right.svg │ ├── chk.svg │ ├── arrow.svg │ └── chked.svg └── Dropdown.vue ├── .eslintrc.json ├── README.md └── package.json /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules/* 2 | build/* -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist 4 | lib/* 5 | !lib/.gitkeep 6 | .vscode 7 | npm-debug.log 8 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "es2015", "es2017" 4 | ], 5 | "plugins": [ 6 | "transform-es2015-modules-commonjs" 7 | ] 8 | } 9 | -------------------------------------------------------------------------------- /examples/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App' 3 | import Dropdown from 'main' 4 | 5 | Vue.use(Dropdown) 6 | 7 | new Vue({ 8 | el: '#app', 9 | render: h => h(App) 10 | }) 11 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import Dropdown from './Dropdown' 2 | 3 | const install = (Vue) => { 4 | Vue.component(Dropdown.name, Dropdown) 5 | } 6 | 7 | export default { 8 | version: '0.0.1', 9 | install 10 | } 11 | -------------------------------------------------------------------------------- /examples/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | test 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "env": { 4 | "browser": true, 5 | "commonjs": true, 6 | "es6": true, 7 | "node": true 8 | }, 9 | "parserOptions": { 10 | "ecmaVersion": 8, 11 | "sourceType": "module" 12 | }, 13 | "rules": { 14 | "no-const-assign": "warn", 15 | "no-this-before-super": "warn", 16 | "no-undef": "warn", 17 | "no-unreachable": "warn", 18 | "no-unused-vars": "warn", 19 | "constructor-super": "warn", 20 | "valid-typeof": "warn", 21 | "semi": [ 22 | "warn", 23 | "never" 24 | ], 25 | "quotes": [ 26 | "warn", 27 | "single" 28 | ], 29 | "arrow-parens": 0, 30 | "generator-star-spacing": 0, 31 | "space-before-function-paren": 0 32 | } 33 | } -------------------------------------------------------------------------------- /src/assets/right.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /src/assets/chk.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Rectangle 281 5 | Created with Sketch. 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /src/assets/arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /src/assets/chked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-dropdown 2 | 3 | This is yet another vue dropdown component. 4 | 5 | ## Install 6 | 7 | Use npm to download code: 8 | 9 | ``` 10 | npm install hsy-vue-dropdown -S 11 | ``` 12 | 13 | then import it into your project, add below code into your `main.js`: 14 | 15 | ```js 16 | import Dropdown from 'hsy-vue-dropdown' 17 | 18 | Vue.use(Dropdown) 19 | ``` 20 | 21 | ## Usage 22 | 23 | ```html 24 | 27 | 28 | 53 | ``` 54 | 55 | ## Props 56 | 57 | Coming... 58 | 59 | 60 | ## Demo 61 | 62 | [Demo](http://vue-demo.hsiaosiyuan.com/#/dropdown) 63 | 64 | ## Screenshot 65 | 66 | 67 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "hsy-vue-dropdown", 3 | "version": "0.0.5", 4 | "description": "vue dropdown component.", 5 | "author": "hsiaosiyuan0 ", 6 | "main": "lib/index.js", 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot --config ./build/webpack.dev.config.js", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules --config ./build/webpack.prod.config.js", 10 | "prepublish": "npm run build" 11 | }, 12 | "devDependencies": { 13 | "babel-core": "^6.21.0", 14 | "babel-eslint": "^6.1.2", 15 | "babel-loader": "^6.2.10", 16 | "babel-plugin-transform-es2015-modules-commonjs": "^6.18.0", 17 | "babel-preset-es2015": "^6.22.0", 18 | "babel-preset-es2017": "^6.16.0", 19 | "cross-env": "^3.1.4", 20 | "css-loader": "^0.23.0", 21 | "eslint": "^3.12.2", 22 | "eslint-loader": "^1.6.1", 23 | "file-loader": "^0.8.4", 24 | "html-webpack-plugin": "^2.28.0", 25 | "json-loader": "^0.5.4", 26 | "style-loader": "^0.13.1", 27 | "url-loader": "^0.5.7", 28 | "vue": "^2.1.10", 29 | "vue-loader": "^10.3.0", 30 | "vue-style-loader": "^2.0.0", 31 | "vue-template-compiler": "^2.1.10", 32 | "webpack": "^2.2.1", 33 | "webpack-dev-server": "^2.3.0" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /examples/App.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 106 | 107 | 117 | -------------------------------------------------------------------------------- /src/Dropdown.vue: -------------------------------------------------------------------------------- 1 | 37 | 38 | 200 | 201 | 345 | --------------------------------------------------------------------------------