react-use-ez

publish (owner only)

npm publish

API

useTheme

import { useTheme, Theme } from "react-use-ez";

const [theme, changeTheme] = useTheme()

<button onClick={() => changeTheme()}>change theme</button>

useBattery

import { useBattery } from 'react-use-ez'

const battery = useBattery()

useHover

import { useHover } from 'react-use-ez'

const [hoverRef, isHovering] = useHover()

<div ref={hoverRef}>{isHovering ? "Hovering" : "Not Hovering"}</div>

useCookie

import { useCookie } from 'react-use-ez'

const [getCookie, setCookie] = useCookie()

console.log(getCookie("cookie-name"))

<button
    onClick={() => {
      setCookie("cookie-name", "cookie-value");
    }}
  >
    點擊
</button>

setCookie config

• name
• value
• exdays
• domainName

useRequest

import { useRequest } from 'react-use-ez'

const getUser = (): Promise<any> => {...}

const { loading, data: users, error } = useRequest(getUsers);

useFactorial

import { useFactorial } from 'react-use-ez'

const { result } = useFactorial(3) // 6

useMediaQuery

import { useMediaQuery } from 'react-use-ez'

const isLargeScreen = useMediaQuery('(min-width: 1024px)')

useEyeDropper

import { useEyeDropper } from 'react-use-ez'

const { isSupported, sRGBHex, open } = useEyeDropper()

useUserInfo

import { useUserInfo } from 'react-use-ez'

const userInfo = useUserInfo()

Type Declarations

/**
 * ip 位置
 *
 * city 所在城市
 *
 * region 所在地區
 *
 * country 所在國家
 *
 * loc 經緯度
 *
 * org 電信公司
 *
 * timezone 時區
 *
 * readme 說明
 */

useDevice (Inaccurate)

import { useDevice } from 'react-use-ez'

const { isPhone, isAndroid, isMobile, isMac } = useDevice()

useBoolean

import { useBoolean } from 'react-use-ez'

const { value, setTrue, setFalse, toggle } = useBoolean(false)

useRemoteConfig (firebase)

import { useRemoteConfig } from 'react-use-ez'

const firebaseConfig = {
  apiKey: ''
  authDomain: ''
  projectId: ''
  storageBucket: ''
  messagingSenderId: ''
  appId: ''
}

const message = useRemoteConfig(firebaseConfig, 'config-name')