ReactJs Флаг IntlTelInput не изменяется при изменении значения атрибута extendedCountries - PullRequest
Новая
       20

ReactJs Флаг IntlTelInput не изменяется при изменении значения атрибута extendedCountries

0 голосов
/ 22 апреля 2020 
 <IntlTelInput
                                  fieldId="numTel"
                                  fieldName="numTel"
                                  type="number"
                                  preferredCountries={
                                    this.state
                                      .countryFlagsToDisplayOnPhoneNumberInput
                                  }
                                />

Изначально у него есть два флага: 

this.state = {

  countryFlagsToDisplayOnPhoneNumberInput: ["fr", "tn"],

};

enter image description here enter image description here

Я создал кнопка, чтобы попытаться изменить отображаемый флаг по умолчанию, который является fr. enter image description here

  testChangeDefaultCountryFlagsToDisplayInPhoneNumberInput() {
    console.log(
      "testChangeDefaultCountryFlagsToDisplayInPhoneNumberInput button clicked"
    );
    // This makes no difference. The displayed flag doesn't change.
    this.setState({
      countryFlagsToDisplayOnPhoneNumberInput: ["tn"],
    });
  }
  testChangeDefaultCountryFlagsToDisplayInPhoneNumberInputCheckState() {
    console.log("this.state.countryFlagsToDisplayOnPhoneNumberInput");
    console.log(this.state.countryFlagsToDisplayOnPhoneNumberInput);
  }

Хотя свойство состояния countryFlagsToDisplayOnPhoneNumberInput изменяется на ["tn"], как я проверял с помощью кнопки checkState. 

testChangeDefaultCountryFlagsToDisplayInPhoneNumberInput button clicked
OperationSavCreation.js:544 this.state.countryFlagsToDisplayOnPhoneNumberInput
OperationSavCreation.js:545 ["tn"]

Флаг, который отображается по умолчанию, по-прежнему является флагом fr: enter image description here

В то время как он должен отображать флаг tn.

Я не уверен, что это связано с тем, что я обновляю состояние или сам компонент IntlTelInput .

...