javascript - アニメーションスケール反応

Question

反応コンポーネントのスケールをアニメーション化しようとしています。それはかなり単純に見えますが、これは基本的にReact-Motionの例から出てきたものです:

var component = () => {
let style = { scale: spring(1.1, presets.wobbly)};
    return (
      <Motion style={style}>
              {value =>
                <div
                  style={{
                    backgroundColor: 'purple',
                    height: '50%', width: '50%', 
                    transform: `scale(${value.scale})`,
                    WebkitTransform: `scale(${value.scale})`,
                  }}>

                </div>
              }
      </Motion>
    );
}

しかし、さまざまな理由でコンポーネントが消えたり、適切に表示されなかったりします。このコンポーネントのスケールを適切にアニメーション化するにはどうすればよいですか?