教程解决一个很具体的需求:一个可复用的按钮组件,点了要滚到页面另一处的某个区块,而这两个组件彼此不知道对方存在。作者没有用 Link 和 Route,因为它们面向路由跳转;而是先讲清 React 里每个组件像一座孤岛,然后从「找共同祖先」入手,把滚动意图通过共同的父级传下去,最终用 ref 拿到真实 DOM 节点来完成滚动。
🔑 核心要点
Link 与 Route 解决的是路由跳转,页内滚动到某个区块是另一个问题。
组件隔离意味着必须有人充当两个孤岛之间的中间人。
共同祖先是传递意图的天然位置,避免为此引入全局状态。
最终动作落在真实 DOM 节点上,ref 是拿到它的可靠方式。
💡 金句
“As we know, in React, every component is like an isolated island.” 译:在 React 里,每个组件就像一座孤岛。