反作用运动弹簧组件导致不变冲突

Question

我有一个正在工作的React组件，它只显示了一个封装在header标记中的小字符串。由于显示正确，我几乎确信我的导入/导出设置正确。当我尝试将<Spring />组件添加到我的render()方法中时，我会看到：

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. Check the render method of Animation。

为什么<Spring>组件会在以前一切正常工作的情况下导致这种情况发生？我下面的代码：

import React from 'react';
import { Spring } from 'react-motion';
class Animation extends React.Component {
  constructor(props){
      super(props);
  }
  render() {
    return (
      <Spring defaultValue={0} endValue={120}>
        {val => {
          let style = {
            height: val,
            position: 'absolute'
          }
          return <div style={style}><h1>Hi!</h1></div>
        }}
      </Spring>
    )
  }
}
export default Animation;

Answer 1

react motion不再是公开的Spring函数，该函数使用props和上下文作为react Component，相反，除了使用value和config的spring函数（小写's'的）外，您还获得了三个可以使用Motion、StaggeredMotion和TransitionMotion的函数。查看Github上关于react motion repo的最新文档。