锚点不跟随滚动位置并且不跳

Question

这是复制链接https://codesandbox.io/s/antd-reproduction-template-5lvmz

我尝试遵循https://ant.design/components/anchor，但是它不起作用。 当我删除

getContainer={() => document.querySelector("#my-scroll-layout")}
showInkInFixed={true} 
affix={true}

锚点跟随滚动位置，但仍然不会跳转。

---

Bellow是完整代码

import ReactDOM from "react-dom"
import { version} from "antd"
import "antd/dist/antd.css"
import "./index.css"
import Lorem from "./Lorem"
import { Anchor } from "antd"
const { Link } = Anchor

ReactDOM.render(
  <div className="App">
    <div>Current antd version: {version}</div>
    <Anchor
      getContainer={() => document.querySelector("#my-scroll-layout")}
      showInkInFixed={true}
      affix={true}
    >
      <Link href="#1" title="1" />
      <Link href="#2" title="2" />

      <Link href="#3" title="3" />
    </Anchor>
    <div id="my-scroll-layout">
      <h1 id="1">1</h1>
      <Lorem />
      <h1 id="2">2</h1>
      <Lorem />
      <h1 id="3">3</h1>
      <Lorem />
    </div>
  </div>,
  document.getElementById("root")
)

Answer 1

您必须为my-scroll-layout div定义滚动和样式。

https://codesandbox.io/s/antd-reproduction-template-voopn