Tengo un problema de retroceso que estoy seguro es bastante básico, pero tan básico que no se molestaron en explicarlo en los documentos. En el archivo 1, tengo el siguiente código:

 export const questionState = atomFamily({ key: "question", default: { question: "", answers: [] }, effects_UNSTABLE: (id) => [ ({ onSet, setSelf }) => { setSelf(cachedQuestionsAPI.getItem(id, "question")); onSet((question) => { updateServerItem(question, "question"); }); }, ], }); export const correctAnswersState = selectorFamily({ key: "correctAnswers", default: [], get: (id) => ({ get }) => { const question = get(questionState(id)); return question.answers?.filter((answer) => answer.is_correct); }, }); export default function Question({ id, questionType }) { const question = useRecoilValue(questionState(id)); const correctAnswers = useRecoilValue(correctAnswersState(id)); console.log(correctAnswers); return ( <div> TEST </div> ); }

console.log(correctAnswers) aquí da el resultado esperado SIN EMBARGO, cuando lo importo a un archivo hermano, produce una matriz vacía. Aquí está ese código:

 import { atom, useRecoilState, useRecoilValue, selectorFamily } from "recoil"; import { correctAnswersState, questionState } from "../Question"; export default function FillInTheBlank({ onSet, question }) { const correctAnswers = useRecoilValue(correctAnswersState(question.id)); console.log(correctAnswers); return (<div>TEST</div>) }

Estoy confundido porque pensé que cuando importé esa familia de selectores de estado de respuestas correctas a mi otro archivo, era esencialmente un puntero a los mismos datos con estado. Claramente hay algo de retroceso conceptual que simplemente no entiendo aquí.

Por extraño que parezca, tengo este código en ese segundo archivo, que SÍ funciona:

 const correctAnswersStringsState = selectorFamily({ key: "correctAnswerStrings", default: [], get: (id) => ({ get }) => { const question = get(questionState(id)); const correctAnswers = get(correctAnswersState(question.id)); const correctAnswerStrings = correctAnswers?.map( (answer) => answer.answer ); return correctAnswerStrings; }, });

Pero no funciona si elimino la llamada get(questionState(id)), aunque get(correctAnswersState(question.id)) también la llame.