reactjs - 反应弹簧动画错误的组件

Question

我正在尝试为组件中的 neworder 设置动画。相反，当我切换表单的可见性时，react spring 会触发表单上已有内容的动画

return (
        <Fragment>
            <div className='dashboard-main-neworder' onClick={newOrder}>
                <img alt='New Order' src={addorder}></img>
                <span>New Order</span>
            </div>
            <Transition
                native
                items={selected}
                from={{ opacity: 0, marginTop: -500 }}
                enter={{ opacity: 1, marginTop: 0 }}
                leave={{ opacity: 0 }}
            >
                {selected =>
                    selected &&
                    (props => (
                        <animated.div style={props}>
                            <NewOrderForm newOrder={newOrder}></NewOrderForm>
                        </animated.div>
                    ))
                }
            </Transition>
        </Fragment>
    );
};

标签： reactjsreact-spring