Skip to content

Commit

Permalink
rename
Browse files Browse the repository at this point in the history
  • Loading branch information
@imhele
imhele committed Jun 19, 2019
1 parent 088e7b6 commit 05c6988
Show file tree
Hide file tree
Showing 3 changed files with 39 additions and 39 deletions.
34 changes: 17 additions & 17 deletions README-zh_CN.md
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
# react-media-hook2
# use-media-easy

[![NPM version](https://img.shields.io/npm/v/react-media-hook2.svg?style=flat)](https://npmjs.org/package/react-media-hook2)
[![NPM downloads](http://img.shields.io/npm/dm/react-media-hook2.svg?style=flat)](https://npmjs.org/package/react-media-hook2)
[![Build Status](https://img.shields.io/travis/imhele/react-media-hook2.svg?style=flat)](https://travis-ci.org/imhele/react-media-hook2)
[![Coverage Status](https://coveralls.io/repos/github/imhele/react-media-hook2/badge.svg?branch=master)](https://coveralls.io/github/imhele/react-media-hook2?branch=master)
[![License](https://img.shields.io/npm/l/react-media-hook2.svg)](https://npmjs.org/package/react-media-hook2)
[![NPM version](https://img.shields.io/npm/v/use-media-easy.svg?style=flat)](https://npmjs.org/package/use-media-easy)
[![NPM downloads](http://img.shields.io/npm/dm/use-media-easy.svg?style=flat)](https://npmjs.org/package/use-media-easy)
[![Build Status](https://img.shields.io/travis/imhele/use-media-easy.svg?style=flat)](https://travis-ci.org/imhele/use-media-easy)
[![Coverage Status](https://coveralls.io/repos/github/imhele/use-media-easy/badge.svg?branch=master)](https://coveralls.io/github/imhele/use-media-easy?branch=master)
[![License](https://img.shields.io/npm/l/use-media-easy.svg)](https://npmjs.org/package/use-media-easy)

[English](https://github.com/imhele/react-media-hook2/blob/master/README.md) | 简体中文
[English](https://github.com/imhele/use-media-easy/blob/master/README.md) | 简体中文

## 安装

```sh
$ npm install react-media-hook2 --save
$ npm install use-media-easy --save
或者
$ yarn add react-media-hook2
$ yarn add use-media-easy
```

## 属性
Expand All @@ -34,7 +34,7 @@ interface UseMediaProps {
### 基本用法

```jsx
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -45,7 +45,7 @@ export default () => {
### 使用 `MediaQueryProperties`

```jsx
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: { maxWidth: 600 } });
Expand All @@ -59,7 +59,7 @@ export default () => {

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [collapsed, setCollapsed] = useState(false);
Expand All @@ -76,7 +76,7 @@ export default () => {

```jsx
import ChildComponent from './example';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ id: 0, query: { maxWidth: 600 } });
Expand All @@ -89,7 +89,7 @@ export default () => {
};

// `./example`
import { getUseMedia } from 'react-media-hook2';
import { getUseMedia } from 'use-media-easy';

export default () => {
const [matches, setProps] = getUseMedia(0);
Expand All @@ -103,7 +103,7 @@ export default () => {

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -122,7 +122,7 @@ export default () => {

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -143,7 +143,7 @@ export default () => {

```tsx
import React from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export enum GlobalId {
MyComponent,
Expand Down
34 changes: 17 additions & 17 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
# react-media-hook2
# use-media-easy

[![NPM version](https://img.shields.io/npm/v/react-media-hook2.svg?style=flat)](https://npmjs.org/package/react-media-hook2)
[![NPM downloads](http://img.shields.io/npm/dm/react-media-hook2.svg?style=flat)](https://npmjs.org/package/react-media-hook2)
[![Build Status](https://img.shields.io/travis/imhele/react-media-hook2.svg?style=flat)](https://travis-ci.org/imhele/react-media-hook2)
[![Coverage Status](https://coveralls.io/repos/github/imhele/react-media-hook2/badge.svg?branch=master)](https://coveralls.io/github/imhele/react-media-hook2?branch=master)
[![License](https://img.shields.io/npm/l/react-media-hook2.svg)](https://npmjs.org/package/react-media-hook2)
[![NPM version](https://img.shields.io/npm/v/use-media-easy.svg?style=flat)](https://npmjs.org/package/use-media-easy)
[![NPM downloads](http://img.shields.io/npm/dm/use-media-easy.svg?style=flat)](https://npmjs.org/package/use-media-easy)
[![Build Status](https://img.shields.io/travis/imhele/use-media-easy.svg?style=flat)](https://travis-ci.org/imhele/use-media-easy)
[![Coverage Status](https://coveralls.io/repos/github/imhele/use-media-easy/badge.svg?branch=master)](https://coveralls.io/github/imhele/use-media-easy?branch=master)
[![License](https://img.shields.io/npm/l/use-media-easy.svg)](https://npmjs.org/package/use-media-easy)

English | [简体中文](https://github.com/imhele/react-media-hook2/blob/master/README-zh_CN.md)
English | [简体中文](https://github.com/imhele/use-media-easy/blob/master/README-zh_CN.md)

## Install

```sh
$ npm install react-media-hook2 --save
$ npm install use-media-easy --save
or
$ yarn add react-media-hook2
$ yarn add use-media-easy
```

## Options
Expand All @@ -34,7 +34,7 @@ interface UseMediaProps {
### Basic usage

```jsx
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -45,7 +45,7 @@ export default () => {
### With `MediaQueryProperties`

```jsx
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: { maxWidth: 600 } });
Expand All @@ -59,7 +59,7 @@ For example, when the screen width changes, let the side menu expand or collapse

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [collapsed, setCollapsed] = useState(false);
Expand All @@ -76,7 +76,7 @@ Sometimes we need to use the same media query in many components to achieve resp

```jsx
import ChildComponent from './example';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ id: 0, query: { maxWidth: 600 } });
Expand All @@ -89,7 +89,7 @@ export default () => {
};

// `./example`
import { getUseMedia } from 'react-media-hook2';
import { getUseMedia } from 'use-media-easy';

export default () => {
const [matches, setProps] = getUseMedia(0);
Expand All @@ -103,7 +103,7 @@ You can pause listener to provide additional *desktop version* on mobile devices

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -122,7 +122,7 @@ export default () => {

```jsx
import { useState } from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export default () => {
const [matches, setProps] = useMedia({ query: '(max-width: 600px)' });
Expand All @@ -143,7 +143,7 @@ You can use `enum` to ensure that the `id` is globally unique:

```tsx
import React from 'react';
import useMedia from 'react-media-hook2';
import useMedia from 'use-media-easy';

export enum GlobalId {
MyComponent,
Expand Down
10 changes: 5 additions & 5 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-media-hook2",
"version": "1.1.2",
"name": "use-media-easy",
"version": "1.2.0",
"main": "lib/index.js",
"types": "lib/index.d.ts",
"typings": "lib/index.d.ts",
Expand Down Expand Up @@ -29,14 +29,14 @@
},
"repository": {
"type": "git",
"url": "https://github.com/imhele/react-media-hook2"
"url": "https://github.com/imhele/use-media-easy"
},
"homepage": "https://github.com/imhele/react-media-hook2",
"homepage": "https://github.com/imhele/use-media-easy",
"authors": [
"Hele <work@imhele.com> (https://github.com/imhele)"
],
"bugs": {
"url": "https://github.com/imhele/react-media-hook2/issues"
"url": "https://github.com/imhele/use-media-easy/issues"
},
"files": [
"lib",
Expand Down

0 comments on commit 05c6988

Please sign in to comment.