Question

React 0.14引入stateless functional components。

您仍然可以通过将其设置为功能上的属性来指定.propTypes和.defaultProps

但是，如果没有设置，我想将其中一个道具初始化为随机值（每个实例）。如果defaultProps只接受一个对象，我就不能这样做。有没有办法使用函数初始化它，还是我必须创建一个完整的React组件？

Answer 1

完成此操作的最简单方法是将默认道具设置为安德鲁所说的随机值。

Component.defaultProps = { 
  someProp: randomValue 
}

如果已设置，则会覆盖此默认值，因此它适用于您描述的行为。

如果您想使用某个功能设置默认值，它的任务基本相同。

Component.defaultProps = { 
  someProp = fxnRandomValue()
}

编辑：

为了确保所有实例真正随机化该prop的值，我建议您完全跳过设置默认道具并在组件内进行分配。例如

const statelessComp = ({ prop }) => {
  prop = prop || fxnRandomValue();
  return (
    ...
  )
}

Answer 2

如果您使用recompose库，则可以实现这样的解决方案：

import { withState } from "recompose";

var enhance = withState("someProp", "updateSomeProp", (props) => props.someProp || randomValue());
var MyComponent = enhance(function(props) {
  // This is your stateless component.
  return <div>{props.someProp}</div>;
});

这基本上创建了一个包含状态的包装器组件。如果someProp未定义，则使用随机值初始化状态。

React无状态功能组件defaultProps功能

2 个答案: