# jung1e-components

> ## Project setup ``` npm install jung1e-components ```

Latest version **0.0.6** (published 2020-03-21) · 0 weekly downloads

## Install

```sh
npm install jung1e-components
pnpm add jung1e-components
yarn add jung1e-components
bun add jung1e-components
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.6 |
| Published | 2020-03-21 |
| First published | 2020-03-18 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 2.4 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | jungle2036 |

## Links

- npm: https://www.npmjs.com/package/jung1e-components
- npm.io page: https://npm.io/package/jung1e-components

## Dependencies (4)

- [vue](https://npm.io/package/vue.md) ^2.6.11
- [core-js](https://npm.io/package/core-js.md) ^3.6.4
- [vue-router](https://npm.io/package/vue-router.md) ^3.1.5
- [semantic-ui-css](https://npm.io/package/semantic-ui-css.md) ^2.4.1

## Recent versions

- 0.0.6 (latest) — 2020-03-21
- 0.0.5 — 2020-03-21
- 0.0.4 — 2020-03-18
- 0.0.3 — 2020-03-18
- 0.0.2 — 2020-03-18
- 0.0.1 — 2020-03-18

## README

# cli-components

## Project setup
```
npm install jung1e-components
```

### Compiles and hot-reloads for development
```
npm run serve
```

### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
See [My Github](https://github.com/Jungle2036/jung1e-components).

## Examples
### Button examples
```html
<div class="PageButton">
  <my-button></my-button>
  <h1>This is an PageButton page</h1>
  <my-button>点个赞再走吧</my-button>
  <br>
  <br>

  <my-button animated = "vertical" >
    <template #hidden>$10000</template>
    <template #visible><i class="shop icon"></i>不要错过哈</template>
  </my-button>

  <my-button animated="fade" >
    <template #hidden>$10000</template>
    <template #visible><i class="shop icon"></i>不要错过哈</template>
  </my-button>

  <br>
  <br>
  <my-button size="mini">Mini小按钮</my-button>
  <br>
  <br>
  <my-button size="large">Large大按钮</my-button>
  <br>
  <br>
  <my-button size="huge">Huge 大按钮</my-button>
  <br>
  <br>
  <my-button disabled icon="bug">带图标的按钮</my-button>
  <br>
  <br>
  <my-button loading icon="child">正在加载的按钮Loading</my-button>
  <br>
  <br>
  <my-button @click="hClick(123)" icon="warning circle">带图标的按钮</my-button>
</div>
```

```javascript
export default {
  name: 'PageButton',
  methods: {
    hClick (a) {
      console.log(a)
    }
  }
}
```

### Divider examples
```html
<div id="PageDivider">
  <my-divider icon="handicap">W</my-divider>
  <my-divider icon="handicap">D</my-divider>
  <my-divider icon="handicap">N</my-divider>
  <my-divider icon="handicap">M</my-divider>
  <my-divider icon="child">D</my-divider>
</div>
```

### Slider examples
```html
<div id="PageSlider">
  <my-slider style="width:960px;hight:600px;"
  :auto="auto"
  :curIdx="curIdx"
  :list="list"
  @click="hClick"></my-slider>
</div>
```

```javascript
export default {
  name: 'PageSlider',
  data () {
    return {
      curIdx: 0,
      list: [{ url: require('../assets/./img/1.jpg'), alt: '1.GW2' },
        { url: require('../assets/./img/2.jpg'), alt: '2.GW2' },
        { url: require('../assets/./img/3.jpg'), alt: '3.GW2' },
        { url: require('../assets/./img/4.jpg'), alt: '4.GW2' },
        { url: require('../assets/./img/5.jpg'), alt: '5.GW2' }
      ],
      auto: 2000
    }
  },
  methods: {
    hClick (idx) {
      console.log(idx)
    }
  }
}

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