store.js
import {useLocalObservable} from "mobx-react-lite";
function chatStore() {
return {
chatmsg: [],
setChatMsg(arr) {
this.chatmsg = arr
},
addChatMsg(msg) {
this.chatmsg.push(msg)
}
}
}
export const useChatStore = () => useLocalObservable(chatStore)
app.js
const App = () => {
const chatMsgStore = useChatStore()
const AppFunctions = {chatMsgStore}
useEffect(() => {
console.log(chatMsgStore.chatmsg)
}, [chatMsgStore.chatmsg])
// лог постоянно пустой, показывает массив из 0
return (
<>
<AppContext.Provider value={AppFunctions}>
.....................................................
</AppContext.Provider>
</>
)
}
export default App;
кастомный хук
fetch.js
async function getChatMessages(url, body, userStore, chatMsgStore) {
........
chatMsgStore.setChatMsg(firstResData)
........
кастомный хук который даже не лежит внутри App получает этот стор и
chatMsgStore.setChatMsg(firstResData)
отрабатывает нормально, и глубоко внутри App компонент ре-рендерится, и сообщения появляются
но почему я не могу в App использовать те же значения и функции из стора и они всегда равны 0 ?
если в App я вызову
addChatMsg(msg) ничего не произойдет ... ?