Question

我有以下要渲染的组件（ https://github.com/sbycrosz/react-native-credit-card-input/blob/master/src/CreditCardInput.js）。它的工作正常，但我想分配默认卡字段值，例如数字，使用定义的values道具。

<CreditCardInput
    gooble={{number: 4111111111111111}}
    values={{number: 4111111111111111}}
    requiresName
    requiresCVC
    requiresPostalCode
    validatePostalCode={validatePostalCode}
    cardImageFront={cardFront}
    cardImageBack={cardBack}
    labelStyle={addCardStyle.label}
    inputStyle={addCardStyle.input}
    validColor={"black"}
    invalidColor={"red"}
    placeholderColor={"darkgray"}
    onFocus={this._onFocus}
    onChange={this._onChange.bind(this)}/>

实际的 CreditCardInput.js 文件应该解构这些值并根据上面链接中的源代码预先填充字段：

const {
  cardImageFront, cardImageBack, inputContainerStyle,
  values: { number, expiry, cvc, name, type }, focused,
  allowScroll, requiresName, requiresCVC, requiresPostalCode,
  cardScale, cardFontFamily, cardBrandIcons,
} = this.props;

    <CreditCard 
     ...
     number={number}
     ...

然而，当我在渲染期间调试 CreditCardInput.js 时，我可以看到this.props包含values属性，但是这是一个空对象（而不是包含定义的数值））。这似乎很奇怪的行为。我已经测试了其他通过的道具（例如：gooble={{number: 4111111111111111}}），它在this.props中正确填充，即使它完全相同，除了名称。

所以在CreditCardInput.js中，当我将源代码从上面更改为使用道具gooble时，它可以工作：

const {
  cardImageFront, cardImageBack, inputContainerStyle,
  gooble: { number, expiry, cvc, name, type }, focused,
  allowScroll, requiresName, requiresCVC, requiresPostalCode,
  cardScale, cardFontFamily, cardBrandIcons,
} = this.props;

    <CreditCard 
     ...
     number={number}
     ...

但是，为什么它不适用于this.props.values /为什么this.props.values是一个空对象。

this.props中的属性值为空

0 个答案: