React의 상태 관리가 쉬워졌습니다.

웹 앱을 빌드하기 위해 반응을 사용하는 경우 상태 관리가 상당히 복잡하다는 것을 알 수 있습니다. redux와 같은 큰 상태 관리 라이브러리를 사용하거나 컨텍스트 API를 사용해야 합니다. 두 가지 접근 방식 모두 작고 빌드하기 쉬운 기능을 작업하는 경우에도 많은 상용구 코드를 작성해야 합니다.

나는 이러한 문제에 직면하여 kladi 이라는 이 유틸리티 라이브러리를 만들었습니다. 컨텍스트 API를 사용하여 빌드됩니다. kladi를 사용하는 것은 매우 간단합니다.

사용 방법은 간단합니다

먼저 다음을 입력하여 kladi를 설치합니다. npm i kladi

그런 다음 구성 요소 트리의 모든 구성 요소가 전역 상태를 가져오도록 기본 구성 요소를 공급자로 래핑해야 합니다.

import { Provider } from "kladi";

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";

ReactDOM.render(
  <Provider initialState={{count: 0}}>
    <App />
  </Provider>,
  document.getElementById("root")
);

구성 요소 트리의 모든 위치에 액세스할 수 있도록 초기 상태 개체를 전달할 수 있습니다.

이제 구성 요소 트리의 어느 곳에서나 상태에 액세스하려면 kladi에서 제공하는 후크를 사용하십시오.

import {useState} from "kladi"

const app = props => {

const [count, setCount] = useState('count')
const [name, setName] = useState('name', "Kladi")

return <>
{count} 
<button onClick={() => {setCount(count + 1)}}>Press</button>
{name}
</>
}

예, 즉석에서 새 상태를 만들고 다른 구성 요소에서도 액세스할 수 있습니다. useState 의 react 후크처럼 보이지만 이 상태는 전역입니다.

상태를 만들고 액세스하려면 고유한 문자열 값을 유지해야 합니다.
또한 새 상태를 생성하려면 기본값을 제공해야 하지만 이미 있는 상태에 액세스하는 경우 기본값을 제공할 필요가 없습니다.

This library is new and under development, if you use this library and found any bugs pls create an issue here.