Сделали асинхронный метод
This commit is contained in:
+11
-19
@@ -1,32 +1,24 @@
|
|||||||
import React, { useState, useEffect } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import { create } from 'zustand'
|
import { create } from 'zustand'
|
||||||
|
|
||||||
const useLightStore = create(set => ({
|
const useUserStore = create(set => ({
|
||||||
isLightOn: false,
|
fetchUser: async userId => {
|
||||||
toggleLight: () => set(state => ({isLightOn: !state.isLightOn})),
|
set({ isLoading: true, error: null})
|
||||||
turnOn: () => set({isLightOn:true}),
|
try {
|
||||||
turnOff: () => set({isLightOn:false}),
|
const response = await fetch(`api/users/${userId}`)
|
||||||
|
const user = await response.json()
|
||||||
|
set({user, isLoading: false})
|
||||||
|
} catch (error) {
|
||||||
|
set({error: error.message, isLoading: false})
|
||||||
|
}
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
|
|
||||||
function LightButton() {
|
|
||||||
const toggleLight = useLightStore(state => state.toggleLight)
|
|
||||||
return (<button onClick={toggleLight}>Переключить свет</button>)
|
|
||||||
}
|
|
||||||
|
|
||||||
function LightOff() {
|
|
||||||
const lightOff = useLightStore(state => state.turnOff)
|
|
||||||
return (<button onClick={lightOff}>Выключить свет</button>)
|
|
||||||
}
|
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
const isLightOn = useLightStore(state => state.isLightOn)
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<h1>Практика по созданию списка задач</h1>
|
<h1>Практика по созданию списка задач</h1>
|
||||||
<div>Лампочка: {isLightOn ? 'Включена' : 'Выключена'}</div>
|
|
||||||
<LightButton />
|
|
||||||
<LightOff />
|
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user