Skip to content

Commit 3022764

Browse files
author
yinquan
committed
the first commit
0 parents  commit 3022764

File tree

72 files changed

+16441
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

72 files changed

+16441
-0
lines changed

‎.browserslistrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
current node
2+
last 2 versions and > 2%
3+
ie > 10

‎.gitignore

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
node_modules
2+
.DS_Store
3+
lib
4+
dist
5+
dist-ssr
6+
*.local

‎.npmignore

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
src/
2+
public/
3+
node_modules/
4+
dist/
5+
docs/
6+
test/
7+
coverage/
8+
example/
9+
rollup.config.js
10+
vue.config.js
11+
babel.config.js
12+
codecov.sh
13+
.travis.yml
14+
*.map

‎CHANGELOG.md

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
1.0.0
2+
- the first stable version

‎CHANGELOG.zh.md

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
1.0.0
2+
- 第一个稳定版本

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2021-present, Yinquan
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

‎README.md

+229
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,229 @@
1+
# VueTree
2+
[![GitHub](https://img.shields.io/github/license/tinywisp/vue-tree)](https://github.com/TinyWisp/vue-tree/master/LICENSE)
3+
[![npm](https://img.shields.io/npm/v/vue-tree)](https://www.npmjs.com/package/vue-tree)
4+
[![codecov](https://codecov.io/gh/TinyWisp/vue-tree/branch/master/graph/badge.svg)](https://codecov.io/gh/TinyWisp/vue-tree)
5+
![Travis (.org)](https://img.shields.io/travis/TinyWisp/vue-tree)
6+
7+
基于vue 3的树形组件。
8+
9+
* [主要特色](#主要特色)
10+
* [开始使用](#开始使用)
11+
* [文档](https://github.com/TinyWisp/vue-tree/wiki/%E6%96%87%E6%A1%A3)
12+
* [示例](https://tinywisp.gitee.io/vue-tree/#/zh/)
13+
* [开源协议](#开源协议)
14+
15+
A highly customizable tree component for vue 3.
16+
* [Features](#features)
17+
* [Getting Started](#getting-started)
18+
* [Document](https://github.com/TinyWisp/vue-tree/wiki/Document)
19+
* [Demos](https://tinywisp.github.io/vue-tree/#/en/)
20+
* [License](#license)
21+
22+
23+
## 主要特色
24+
* 支持复选框
25+
* 可异步加载
26+
* 拖放操作
27+
* 右键菜单
28+
* 按钮
29+
* 自定义外观
30+
31+
## 文档
32+
* [文档](https://github.com/TinyWisp/vue-tree/wiki/%E6%96%87%E6%A1%A3)
33+
34+
## 开始使用
35+
36+
npm
37+
```
38+
npm install vue-tree --save
39+
```
40+
41+
引入
42+
```
43+
import VueTree from 'vue-tree'
44+
```
45+
46+
示例
47+
```javascript
48+
<template>
49+
<div id="app">
50+
<VueTree :tree="tree" ref="tree" class="tree" />
51+
</div>
52+
</template>
53+
54+
<script>
55+
import VueTree from 'vue-tree'
56+
57+
export default {
58+
name: 'App',
59+
components: {
60+
VueTree
61+
},
62+
data() {
63+
return {
64+
tree: [
65+
{
66+
id: 1,
67+
title: 'ROOT',
68+
hasChild: true,
69+
children: [
70+
{
71+
id: 2,
72+
title: 'child 1',
73+
},
74+
{
75+
id: 3,
76+
title: 'child 2',
77+
hasChild: true,
78+
children: [
79+
{
80+
id: 4,
81+
title: 'child 2-1'
82+
},
83+
{
84+
id: 5,
85+
title: 'child 2-2'
86+
},
87+
{
88+
id: 6,
89+
title: 'child 2-3'
90+
}
91+
],
92+
},
93+
{
94+
id: 7,
95+
title: 'child 3'
96+
},
97+
{
98+
id: 8,
99+
title: 'child 4'
100+
}
101+
]
102+
}
103+
]
104+
}
105+
}
106+
}
107+
</script>
108+
109+
<style scoped>
110+
.tree {
111+
width: 200px;
112+
height: 300px;
113+
}
114+
</style>
115+
116+
```
117+
118+
## 示例
119+
* [示例](https://tinywisp.gitee.io/vue-tree/)
120+
121+
## 开源协议
122+
* MIT
123+
* 无论个人还是公司，都可以免费自由使用
124+
125+
---
126+
127+
128+
## Features
129+
* checkbox
130+
* async loading
131+
* drag and drop
132+
* context menu
133+
* button
134+
* customizable appearance
135+
136+
## Getting Started
137+
138+
npm
139+
```
140+
npm install vue-tree --save
141+
```
142+
143+
import the library
144+
```
145+
import VueTree from 'vue-tree'
146+
```
147+
148+
usage
149+
```javascript
150+
<template>
151+
<div id="app">
152+
<VueTree :tree="tree" ref="tree" class="tree" />
153+
</div>
154+
</template>
155+
156+
<script>
157+
import VueTree from 'vue-tree'
158+
159+
export default {
160+
name: 'App',
161+
components: {
162+
VueTree
163+
},
164+
data() {
165+
return {
166+
tree: [
167+
{
168+
id: 1,
169+
title: 'ROOT',
170+
hasChild: true,
171+
children: [
172+
{
173+
id: 2,
174+
title: 'child 1',
175+
},
176+
{
177+
id: 3,
178+
title: 'child 2',
179+
hasChild: true,
180+
children: [
181+
{
182+
id: 4,
183+
title: 'child 2-1'
184+
},
185+
{
186+
id: 5,
187+
title: 'child 2-2'
188+
},
189+
{
190+
id: 6,
191+
title: 'child 2-3'
192+
}
193+
],
194+
},
195+
{
196+
id: 7,
197+
title: 'child 3'
198+
},
199+
{
200+
id: 8,
201+
title: 'child 4'
202+
}
203+
]
204+
}
205+
]
206+
}
207+
}
208+
}
209+
</script>
210+
211+
<style scoped>
212+
.tree {
213+
width: 200px;
214+
height: 300px;
215+
}
216+
</style>
217+
218+
```
219+
220+
## Document
221+
* [Document](https://github.com/TinyWisp/vue-tree/wiki/Document)
222+
223+
## Demos
224+
* [Demos](https://tinywisp.github.io/vue-tree/)
225+
226+
## License
227+
* MIT
228+
* it is free for commercial use.
229+

‎babel.config.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
const devPresets = ['@vue/babel-preset-app'];
2+
const buildPresets = ['@babel/preset-env'];
3+
module.exports = {
4+
presets: (process.env.NODE_ENV === 'development' ? devPresets : buildPresets),
5+
};

‎example/App.vue

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template>
2+
<router-view></router-view>
3+
</template>
4+
5+
<script>
6+
export default {
7+
name: 'App',
8+
}
9+
</script>

‎example/index.css

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
#app {
2+
font-family: Avenir, Helvetica, Arial, sans-serif;
3+
-webkit-font-smoothing: antialiased;
4+
-moz-osx-font-smoothing: grayscale;
5+
text-align: center;
6+
color: #2c3e50;
7+
margin-top: 0;
8+
}
9+
10+
body {
11+
margin: 0;
12+
}

‎example/main.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { createApp } from 'vue'
2+
import Home from './views/Home.vue'
3+
import './index.css'
4+
import router from './router'
5+
6+
createApp(Home).use(router).mount('#app')

0 commit comments

Comments
 (0)