Привет всем! как вы шарите инстанс xstate между компонентами? Попробовал

Question

Привет всем! как вы шарите инстанс xstate между компонентами? Попробовал

через Context, но возникает проблема с типами 😩

import { createContext, ReactNode, useContext, useMemo } from 'react';
import { useMachine as xUseMachine } from '@xstate/react';
import { InterpreterFrom, StateFrom } from 'xstate';

import machine from './machine';

type ContextValue = {
state: StateFrom<typeof machine>;
send: InterpreterFrom<typeof machine>['send'];
};

export const MachineContext = createContext<ContextValue | undefined>(undefined);

export const MachineProvider = ({ children }: { children: ReactNode }) => {
const [state, send] = xUseMachine(machine);

const context = useMemo(() => ({ state, send }), []);

return <MachineContext.Provider value={context}>{children}</MachineContext.Provider>;
};

export const useMachine = () => {
const machineContext = useContext(MachineContext);

if (!machineContext) {
throw new Error('useMachine must be used within a MachineProvider');
}

const { state, send } = machineContext;

return [state, send];
};

Что тут не так? Дальше в компоненте, при вызове
useMachine
TS ругается, что нет у него таких properties :(

#programming #russian #typescript

0

26.08.2022

1 ответов

6 просмотров

アレクサンダー・バキマトフ · Accepted Answer

アレクサンダー・バキマトフ

https://t.me/ts_cool/169544

0

27.08.2022

169 похожих чатов

Привет всем! как вы шарите инстанс xstate между компонентами? Попробовал

1 ответов

Похожие вопросы