# tf-tabs-cache

> tabs多页缓存组件

Latest version **0.1.5** (published 2019-12-25) · ISC license · 0 weekly downloads

## Install

```sh
npm install tf-tabs-cache
pnpm add tf-tabs-cache
yarn add tf-tabs-cache
bun add tf-tabs-cache
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.1.5 |
| Published | 2019-12-25 |
| First published | 2019-07-19 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 175.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Maintainers | tffed |

## Links

- npm: https://www.npmjs.com/package/tf-tabs-cache
- Repository: https://github.com/newchen/tf-tabs-demo
- Homepage: https://github.com/newchen/tf-tabs-demo#readme
- Issues: https://github.com/newchen/tf-tabs-demo/issues
- npm.io page: https://npm.io/package/tf-tabs-cache

## Dependencies (6)

- [dva](https://npm.io/package/dva.md) ^2.4.1
- [react](https://npm.io/package/react.md) ^16.8.6
- [react-dom](https://npm.io/package/react-dom.md) ^16.8.6
- [query-string](https://npm.io/package/query-string.md) ^6.9.0
- [dva-model-extend](https://npm.io/package/dva-model-extend.md) ^0.1.2
- [react-router-cache-route](https://npm.io/package/react-router-cache-route.md) ^1.8.4

## Recent versions

- 0.1.5 (latest) — 2019-12-25
- 0.1.4 — 2019-07-19
- 0.1.3 — 2019-07-19

## README

## tabs多页缓存组件

### 1. 示例

[demo地址](https://github.com/newchen/tf-tabs-demo)

### 2. 已解决问题

```
1. 例如路由: /user/:id, 那访问: /user/123, /user/234, /user/4545, 是希望缓存这3个页面的
2. 怎么刷新 / 删除 tabs ? 
3. 如何限制tabs打开的个数 ?
4. 如果支持一个路由或页面打开多次, namespace该如何注册和切换 ? 
5. 如何获取tabs页面标题 
```

### 3. 使用

```
import { 
  getRealNS, 
  getTitle, 
  getCount, 
  connect, 
  unload, 
  refresh, 
  RouteComponent, 
  dynamicNS 
} from 'tf-tabs-cache'

// 如果是/user/:id形式的路由, 可能会用到该方法, 获取当前真实的namespace
getRealNS(ns)

// 获取url地址标题
getTitle(url)

// 当前已经打开了多少个tabs页面
getCount()

// 使用方式和react-redux的connect方法一致, 如果是/user/:id形式的路由, 请使用该方法
connect(xx)(xx)

// 卸载url页面
unload(url)

// 刷新当前页面
refresh()

// 中间件: 用于/user/:id形式路由时, namespace自动切换
dynamicNS

// RouteComponent组件, 使用参照根目录下的router.js
RouteComponent

```

### 4. 依赖

依赖组件: [react-router-cache-route](https://github.com/CJY0208/react-router-cache-route)


### 5. 更新记录

```
  0.1.5-beta:
    实现: https://umijs.org/zh/guide/runtime-config.html
    目前实现了: setRuntime, patchRoutes, render, onRouteChange 运行时方法
```

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