ant-design/components/affix/demo/basic.md
2020-01-06 11:13:39 +08:00

726 B

order title
0
zh-CN en-US
基本 Basic

zh-CN

最简单的用法。

en-US

The simplest usage.

import React, { useState, FC } from 'react';
import { Affix, Button } from 'antd';

const Demo: FC = () => {
  const [top, setTop] = useState(10);
  const [bottom, setBottom] = useState(10);

  return (
    <div>
      <Affix offsetTop={top}>
        <Button type="primary" onClick={() => setTop(top + 10)}>
          Affix top
        </Button>
      </Affix>
      <br />
      <Affix offsetBottom={bottom}>
        <Button type="primary" onClick={() => setBottom(bottom + 10)}>
          Affix bottom
        </Button>
      </Affix>
    </div>
  );
};

ReactDOM.render(<Demo />, mountNode);