时间戳

首页 > 解决方案 > prop 的默认类型取决于另一个 prop 的值

javascript - prop 的默认类型取决于另一个 prop 的值

问题描述

我有这个组件可以满足单选或多选功能。如果 multiselect 为真，则 initialValue 应该是一个空数组。否则，它应该是一个空对象。在这种情况下，设置 defaultProps 看起来有点复杂。有什么方法可以initialValue根据 的值设置默认道具multiselect吗？

const wrap = compose(
  setPropTypes({
    initialValue: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
    multiselect: PropTypes.bool,
  }),
  defaultProps({
    initialValue: // [] or {} or ((otherProps) => otherProps.multiselect ? [] : {}) ??? , if there is such thing
    multiselect: false,
  })
);

如果我将其设置为{}，用户仍然可以通过multiselect={true}而不通过 defaultValue。在这种情况下，几个函数将map通过 defaultValue 而它不是一个数组，导致数据处理不当和许多错误。

如果我只是不小心假设其他情况，也会发生同样的情况。有什么完美的方法吗？提前致谢。

标签： javascriptreactjsreact-proptypes

解决方案

用简单的语言，这是不可能的。我在我的几个组件中遇到了同样的困境。我的建议是使用两个属性，每个选择类型一个。此外，您可以删除多选属性并检查我提到的两个属性中的哪一个不为空。简而言之：

const wrap = compose(
  setPropTypes({
    initialSingleValue: PropTypes.object,
    initialMultiValue: PropTypes.array,
  }),
  defaultProps({
    initialSingleValue: {}
    initialMultiValue: nil,
  })
);

我希望这可以帮助你。

推荐阅读