如何在React组件上设置组件默认道具
我使用下面的代码在React组件上设置默认道具，但是它不起作用。在该render()方法中，我可以看到输出“ undefined
props”已打印在浏览器控制台上。如何为组件道具定义默认值？
export default class AddAddressComponent extends Component {
render() {
let {provinceList,cityList} = this.props
if(cityList === undefined || provinceList === undefined){
console.log('undefined props')
}
...
}
AddAddressComponent.contextTypes = {
router: React.PropTypes.object.isRequired
}
AddAddressComponent.defaultProps = {
cityList: [],
provinceList: [],
}
AddAddressComponent.propTypes = {
userInfo: React.PropTypes.object,
cityList: PropTypes.array.isRequired,
provinceList: PropTypes.array.isRequired,
}
问题答案：
您忘记合上Class支架了。
class AddAddressComponent extends React.Component {
render() {
let {provinceList,cityList} = this.props
if(cityList === undefined || provinceList === undefined){
console.log('undefined props')
} else {
console.log('defined props')
}
return (
<div>rendered</div>
)
}
}
AddAddressComponent.contextTypes = {
router: React.PropTypes.object.isRequired
};
AddAddressComponent.defaultProps = {
cityList: [],
provinceList: [],
};
AddAddressComponent.propTypes = {
userInfo: React.PropTypes.object,
cityList: React.PropTypes.array.isRequired,
provinceList: React.PropTypes.array.isRequired,
}
ReactDOM.render(
<AddAddressComponent />,
document.getElementById('app')
)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="app" />
-
如何给组件的props设置默认值？
-
本文向大家介绍如何给非控组件设置默认的值？相关面试题，主要包含被问及如何给非控组件设置默认的值？时的应答技巧和注意事项，需要的朋友参考一下 表单元素依赖于状态(state)，表单元素需要默认值实时映射到状态的时候，就是受控组件 不通过state控制表单元素，而是通过ref来控制的表单元素就是非受控组件
-
我可以为我的vaadin fileupload组件设置默认上载路径吗？我想设置一些上载路径到我的vaadin组件。如果有人不选择上传任何文件，我的特定文件将被上传。有可能吗？ 例如：I would like to do as
-
当对输入字段使用默认值时，如何绕过带有道具状态的反模式？ 在呈现窗体时，它应该包含一些默认值。当我设置一些值并关闭表单，然后重新打开表单时，我希望显示默认值，而不是以前输入的值······ 但是当我让state从道具继承值时，道具就永远改变了。我还没找到绕过这个的方法。
-
问题内容： 什么是对React组件prop更新进行单元测试的正确方法。 这是我的测试装置； 这可以正常工作，并且测试通过了，但是显示了反应警告消息 我要测试的只是属性的更新，而不是使用其他属性创建元素的新实例。有没有更好的方法来执行此属性更新？ 问题答案： AirBnB的酶库为这个问题提供了一个优雅的解决方案。 它提供了一个setProps方法，可以在浅包装或jsdom包装上调用该方法。
-
我正在研究bean验证，我正在寻找一种可能性来设置我自己的bean验证注释的默认组。 我有这样的东西（工作）： RequiredBySecondStepValidator.class（一个实现的约束验证器） secondstep.class（bean验证组） 不幸的是，根据规范，不可能在注释中设置默认组，如下所示：