본문 바로가기

개발하자

react.js로 svelt store를 사용하는 방법

반응형

react.js로 svelt store를 사용하는 방법

svelt store를 react.js와 함께 사용할 수 있는 방법이 있나요? 나는 그것이 단순하고 대체되는 방식이 정말 좋다. 여기 svelte doc의 예시 코드가 있습니다.

import { writable } from 'svelte/store';

function createCount() {
    const { subscribe, set, update } = writable(0);

    return {
        subscribe,
        increment: () => {},
        decrement: () => {},
        reset: () => {}
    };
}

export const count = createCount();



부디 무시하고 받아들여져야 할 다른 대답을 보세요.




이 작업은 React 후크를 사용하여 쉽게 수행할 수 있습니다.

import {useEffect, useState} from 'react';
import {get} from 'svelte/store';

const unset = Symbol();

export function useReadable(store) {
  const [value, set] = useState(unset);

  useEffect(() => store.subscribe(set), [store]);

  return value === unset ? get(store) : value;
}

export function useWritable(store) {
  const [value, set] = useState(unset);

  useEffect(() => store.subscribe(set), [store]);

  return [
    value === unset ? get(store) : value,
    store.set,
    store.update
  ];
}

편집하다

이 답변 후에 저는 실제로 이것을 포장했습니다. 그 코드는 생산에 사용되어 왔다. 그것은 이해하기 쉽다.


반응형