React无状态功能组件defaultProps函数

React 0.14引入stateless functional components。React无状态功能组件defaultProps函数

，你还可以通过在功能

不过，我想初始化道具之一为随机值（每个实例），如果它没有设置将它们设置为属性指定.propTypes和.defaultProps。我不能这样做，如果defaultProps只接受一个对象。有没有办法使用函数来初始化它，还是我必须创建一个完整的React组件？

来源

2016-09-13 mpen

只要把'var value = props.value || randomValue（）;'在你的函数中？ –

@FelixKling如果不重新实例化组件，是不可能更改道具的？因为如果组件被重新渲染，我希望它使用相同的值。但是，如果无状态的功能组件从未被重新渲染，那就没问题了。 – mpen

完成此操作的最简单方法是将默认道具设置为随机值，如Andrew所述。

Component.defaultProps = { 
    someProp: randomValue 
}

如果它被设置，这个默认值会被覆盖，所以它适用于你描述的行为。

如果您想使用函数设置默认值，则它基本上是相同的赋值。

Component.defaultProps = { 
    someProp = fxnRandomValue() 
}

编辑：

，以确保所有情况下真正的随机道具这种的价值，我建议你跳过设置默认干脆托，做组件内的分配。例如。

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

来源

2016-09-13 23:39:31 Cent

对不起，我不认为我很清楚。我想要每个实例的随机值。第一次渲染组件后，该值不会改变，但每个实例都需要自己的唯一值。我很确定你的解决方案将为所有实例创建一个值。 – mpen

不一定。这取决于你的随机函数的工作方式。每当函数想要创建每个实例时，都会调用defaultProps。但是，如果您担心在其他地方可能不是随机的，您可以选择在该功能内进行分配。 – Cent

'prop = prop || fxnRandomValue（）'会导致它在每次重新渲染时获得不同的随机值，不是吗？它应该在第一次实例化之后进行修复。另外'Component.defaultProps'是一个静态属性，而不是一个函数，所以它不会被“调用”。 – mpen

如果使用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未定义，则状态将使用随机值进行初始化。

来源

2016-09-14 03:23:35

React无状态功能组件defaultProps函数

回答

相关问题