React-Postcode-Hook

다음 우편 번호 API를 리액트에서 커스텀 훅 방식으로 제공하는 라이브러리.

설치

npm install --save react-postcode-hook

사용법

import React, { useRef } from 'react';
import ReactPostCodeHook from 'react-postcode-hook';

const App = function () {
    const ref = useRef(null);

    const on = (data) => {
        console.log(data);
    }
    
    const postConfig = {
        ref : ref,
        onComplete : on
    };
    const postCode = ReactPostCodeHook(postConfig);
   
    return (
        <main>
            test
            <input type="text"  onClick={() => postCode()} />
            <div ref={ref}></div>
        </main>
    );
};

react-hook-form을 같이 쓸 경우

import React, { useRef } from 'react';
import ReactPostCodeHook from 'react-postcode-hook';
import { useForm } from 'react-hook-form';


const App = function () {
    const { setValue, handleSubmit } = useForm();
    const ref = useRef(null);

    const on = (data) => {
        setValue('test', "tasdasdsasd");
        handleSubmit((data) => console.log(data))();
    }
    
    const postConfig = {
        ref : ref,
        onComplete : on
    };
    const postCode = ReactPostCodeHook(postConfig);
   
    return (
        <main>
            test
            <input type="text"  onClick={() => postCode()} />
            <div ref={ref}></div>
        </main>
    );
};

License

react-postcode-hook is MIT licensed.