Recoil：如何在Atom状态变更时触发函数

将用户对象存储在Recoil的Atom中，希望每次对象变更时自动缓存到localStorage，避免应用崩溃后用户需重新登录。此前使用useContext时，可通过父组件App.js中的useEffect监听user对象变更实现该功能，但迁移至Recoil后，因NextJS项目结构（RecoilRoot包裹子组件，父组件App.js无法调用useRecoil相关方法）无法再采用该方式，想了解Recoil是否有内置方法实现这类监听器或回调。

期望流程：

• 声明状态：const [user, setUser] = useRecoilState(userAtom)
• 触发变更：setUser({...})
• 状态变更时触发回调：localStorage.setItem('user', JSON.stringify(user))

Recoil的atom()构造器内置了effects钩子，可用于监听状态变更并执行自定义逻辑。

示例代码：

export const userAtom = atom({
    key: 'user',
    default: null,
    effects: [
        ({onSet}) => {
            onSet(data => {
                localStorage.setItem('user', JSON.stringify(data))
                console.log("更新后的用户数据（state.tsx）: ", data)
            })
        }
    ]
})

内容的提问来源于stack exchange，提问作者jingwen