2016-08-16 3 views
0

別の選択リストに基づいてintl-Tel-Inputで選択された国を変更したいと思います。例えばマレーシアが国選択リストで選択されている場合、intl-Tel-Inputはマレーシアに変更され、フラグとコードが表示されます。国が米国に変更された場合と同様に、インテルの電話入力もそれに応じて変更する必要があります。intlTelInputの国を別の選択リストから変更する

何か助けていただければ幸いです。

よろしくお願いいたします。

答えて

0

私は単にそこに特定の名前を持つすべての国コードを含むjsのオブジェクト「JSONフォーマットの種類」を作成し、動的にあなたが反応を使用している場合はJavaScript

0

を使用して、国選択マッチ一度入力プレースホルダを変更しようとしますここに解決策があります

constructor(){ 
    super() 
    this.state = { 
     updated:true 
    } 
} 

国が変更されている場合は追跡してください。

componentWillReceiveProps(nextProps){ 
    if(this.props.selectedCountry !== nextProps.selectedCountry){ 
     this.setState({ 
      updated:false 
     }) 
    } 
} 

その、今

今変更
componentDidUpdate(nextProps){ 
    if(this.props.selectedCountry !== nextProps.selectedCountry){ 
     this.setState({ 
      updated:true 
     }) 
    } 
} 

を変更しようとして説明します。

render(){ 
    const { selectedCountry } = this.props; 
    var countryCode = 'us' 
    if(selectedCountry) 
     countryCode = selectedCountry.toLowerCase() 

    var field = <Field 
     className="ibm-fullwidth urx-country" 
     name="phone" 
     onInputChange={this.onInputChange} 
     component={this.renderPhoneInput} 
     defaultCountry={countryCode} 
     /> 

    return (
     <span> 
     {this.state.updated && 
      <span>{field}</span> 
     } 
     </span> 
    ) 
} 

基本的には、国の変更について再レンダリングされています。

関連する問題