# vue-uri

> easy query uri import for vue & vue-router

Latest version **0.1.0** (published 2018-05-09) · ISC license · 0 weekly downloads

## Install

```sh
npm install vue-uri
pnpm add vue-uri
yarn add vue-uri
bun add vue-uri
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2018-05-09 |
| First published | 2018-05-09 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 5.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | hudk |
| Maintainers | hudk |
| Keywords | vue, vue-router, uri |

## Links

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

## Dependencies (1)

- [@hudk/assert](https://npm.io/package/@hudk/assert.md) ^0.1.0

## Alternatives

- [express-promise-router](https://npm.io/package/express-promise-router.md) — 736.1K weekly downloads
- [next-usequerystate](https://npm.io/package/next-usequerystate.md) — 29.8K weekly downloads
- [@bitkyc08/opencodex](https://npm.io/package/@bitkyc08/opencodex.md) — 4.6K weekly downloads
- [lynkr](https://npm.io/package/lynkr.md) — 575 weekly downloads
- [baremetal.js](https://npm.io/package/baremetal.js.md) — 42 weekly downloads

## Recent versions

- 0.1.0 (latest) — 2018-05-09

## README

# vue-uri
easy query uri import for vue & vue-router

# usage
1. 项目中需使用vue2.x及对应的vue-router

      ```bash
      npm install @hudk/vue-uri
      ```

1. 引入
    * 全局引入
      ```js
      import { query } from '@hudk/vue-uri';
      Vue.mixin(query);
      ```
    * 组件引入
      ```js
      import { query } from '@hudk/vue-uri';
    
      Vue.extends({
        mixins: [query]
      });
      ```
1. 使用
    
    * 在组件的data中定义{Object}queryData，用于存放需要放到uri中的数据；在methods中定义query方法，用于发起真正的请求
    
    * 在需要发起请求的地方，调用handleQuery方法，方法会将queryData放到uri上并自动存储一次

    * 对于翻页和回车查询这两类在query中常用的操作，`vue-uri` 提供了两个方法：对于回车查询，对需要触发回车自动查询的属性绑定 `DOMElement.onkeyDown = this.keyDown` ；对换页查询，换页后直接触发`handleCurrentChange(page, pageSize)`，page与pageSize会默认被加到query中，可通过 `this.m_page` 与 `this.m_pageSize` 两个属性获取这两个值

# 跳页逻辑

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