对于不需要 shareable 的状态，则可以使用 zustand 。
目前我的状态管理方案：
1. context
2. url state
3. react-query
4. zustand

还有就是 @ChefIsAwesome 说的，保存在 url 里可以将状态方便地分享给别人。

tanstack router 的文档上是这么说的： https://tanstack.com/router/latest/docs/framework/react/overview#1st-class-search-parameters
> Let's step back and remember that search params are the most powerful state manager in your entire application. They are global, serializable, bookmarkable, and shareable making them the perfect place to store any kind of state that needs to survive a page refresh or a social share.

url + react-query

将页面状态保持到 url 里，url state 就是一个天然的全局 state store 。

请求用 react-query ，react-query 会自动缓存住请求的数据。当从 detail 回到 list 时，会马上得到之前缓存的请求数据，react-query 同时会在后台去重新请求并更新。

以前也尝试过其它各种方案，现在下来发现这套是最舒服的。写了一个极轻量的 react url-state-hook ，可以适配任意 react router 库 - https://github.com/baurine/use-url-state

tidbcloud.com 可以建 5 个免费集群，兼容 MySQL

好的，谢谢大家！我再一一对比看看。家里就老人自己，平时就看看手机，所以没有装宽带的需求。

踩过这个坑，美国客户发的会议邀请，上面写的是 cst 时间，然后就放了他们鸽子...

哈哈，居然和 OP 同款，下个月就满两年，个人觉得帝豪 S 除了后备箱小了点外，其它都挺满意的，家里有一个小孩，乘坐空间非常充裕。如果要换车的话，我应该是选择一辆电车，在这么炎热的夏天，驻车时可以放心地在车里吹着空调，露营时可以放心地在车里吹着空调睡觉，这一点就很是吸引我。

@Aoang 还好还有 tailwindcss ，可以说是生逢其时了。

是什么编辑器? 我在 VS Code 里没搜到这个插件的名称。

我自己是在 VS Code 里安插的 tailwind 官方的 Tailwind CSS IntelliSense 插件，直接把 className 声明成 string 就行了，本来 className 就是字符串。

示例代码如下，当我在 TestComp 的 className 中输入 m-a 的时候就自动出现了 m-auto 的提示。(截图不知道该怎么贴)

```
const TestComp: React.FC<{ className: string }> = ({ className }) => {
return <div className={className} />
}

const TestPage: React.FC = () => {
return (
<div className='w-96 m-auto'>
<h1 className='text-center'>Test Page</h1>
<TestComp className='w-10 m-a...'/>

</div>
)
}
```

投星越 L 一票，4S 店看过几次，心动。预算不够，自己买的是帝豪 S ，紧凑型 SUV ，已经带了 360 度影像和智能巡航，没有 Carplay ，开着挺满意的。

其实也可以不用前后端分离。如果不前后端分离的话，可以看看 remix ( https://remix.run/ ) 这个框架。

一种解决方案：Turbolinks 。相关的 blog: https://baurine.com/2018/10/02/uninterrupted-audio-player-turbolinks/ - 借助 Turbolinks 实现不间断的网页音乐播放器