简体   繁体   中英

How to change the value in a select field in react native

I am creating a drop down (using select field) where I want to get the 6 environments below in a drop down, for now the default value is MMP_SSL, so httpLink SERVER_URL is set to MMP_SSL.

I would like to change to SD then, httpLink SERVER_URL should be SD. In the EnvironmentChange function is where I am changing this values, the 6 values are coming from one array.

  LOCAL: 'http://localhost:4000',
  LOCAL_IOS: 'http://172.0.0.0',          //change the ip address with the IP of your laptop
  LOCAL_DEMO: 'http://kaushikna.run', // Pointing to Local environment through internet
  MMP: 'http://dclm-mmp1.cluster1.-service', 
  MMP_SSL: 'https://bssmo-service',  //E2E environment 
  SD: 'http://dclmapps.19dclm-service', // Pointing to SD environment


const httpLink = createHttpLink({
  uri: SERVER_URL.MMP_SSL
});

EnvironmentChange = (key, val) => {
    this.handleLanguageChange({ field: "preferredEnv" }, val);
  };

  handleLanguageChange = (props, e) => {
    let tempObj = this.state.preferredEnv;
    tempObj[props.field] = e;
    this.setState({ preferredEnv: e });
  };

let envData = [];
    masterData.language.map(({ code: value, name: label }) => {
      envData.push({ value, label });
    });
    
          <SelectField
                    label="Environment"
                    node="presentationLanguage"
                    options={envData}
                    value={"MMP_SSL"}
                    onChange={this.EnvironmentChange}
                    that={this}
                    setIcon={true}
                  />

Try something like this, I have this piece of code working in react env.

<select value={this.state.preferredEnv}>
  <option value="A">Apple</option>
  <option value="B">Banana</option>
  <option value="C">Cranberry</option>
</select>

The value that you pass as a prop to your SelectField component should be your state variable like so:

<SelectField
  label="Environment"
  node="presentationLanguage"
  options={envData}
  value={this.state.preferredEnv}
  onChange={this.EnvironmentChange}
  that={this}
  setIcon={true}
/>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM