antd的Tabs组件通过代码控制换页时为什么不触发onChang回调

Question

import { useState } from "react";
import { Button, Tabs } from "antd";

const { TabPane } = Tabs;

const TabsTest = (props) => {
    const [activeKey, setActivekey] = useState('1');

    function callback(key) {
        setActivekey(key);
        console.log(key);
    }

    function onChangeTabPanel() {
        setActivekey('2');
    }

    return (
        <div>
            <Tabs activeKey={activeKey} onChange={callback}>
                <TabPane tab="Tab 1" key="1">
                    Content of Tab Pane 1
                </TabPane>
                <TabPane tab="Tab 2" key="2">
                    Content of Tab Pane 2
                </TabPane>
                <TabPane tab="Tab 3" key="3">
                    Content of Tab Pane 3
                </TabPane>
            </Tabs>

            <Button onClick={() => onChangeTabPanel()}>换到第2页</Button>
        </div>
    );
}

export default TabsTest;

上面的例子里，我希望点击 换到第2页 这个按钮时，界面切换到第2个TabPane，同时触发OnChang，但实际是界面切换到了第2个TabPane，没有触发OnChang。
问题是通过代码控制换页时，怎么做才会触发OnChang，或者有类似的其他回调事件可用吗？