ReactJS钩子重新渲染功能组件

Question

使用功能组件时，每次设置状态时下拉列表都会重新渲染，并且下拉列表中的值不会更改。

编辑： 我正在使用语义ui react库。 （https://react.semantic-ui.com/collections/form/#shorthand-subcomponent-control）

const Table = () => {
    const [tickers, setTickers] = useState("")
    const test = [{
        key: 1,
        text: "0001",
        value: "0001"
    },{
        key: 2,
        text: "0002",
        value: "0002"
    }]
    const DropdownSelection = () => {
        return (
            <Form.Select
                fluid
                search
                multiple
                name="ticker"
                options={test}
                onChange={(e, { value }) => setTickers(value)}
                placeholder="Tickers"
            />
            )
    }

    return(
            <Form>
                    <DropdownSelection />
            </Form>)

但是，当我将组件放入return函数中时，它可以工作。虽然下拉列表仍在重新渲染，但其中包含值。

const Table = () => {
    const [tickers, setTickers] = useState("")
    const test = [{
        key: 1,
        text: "0001",
        value: "0001"
    },{
        key: 2,
        text: "0002",
        value: "0002"
    }]
    return(
           <Form>
               <Form.Select
                fluid
                search
                multiple
                name="ticker"
                options={test}
                onChange={(e, { value }) => setTickers(value)}
                placeholder="Tickers"
               />
           </Form>)

可能是什么问题？