React Material UI Placeholder должен быть выбран элемент в поле выбора - PullRequest
Новая
       25

React Material UI Placeholder должен быть выбран элемент в поле выбора

0 голосов
/ 21 октября 2019

Я пишу форму и с полем выбора. Я хочу, чтобы при выборе страны я увидел название страны в поле. Я не знаю, называется ли это местозаполнителем или как-то еще.

Это Компонент: 

import React from 'react';
import TextField from '@material-ui/core/TextField';
import { FormGroup } from '@material-ui/core';

import InputLabel from '@material-ui/core/InputLabel';
import MenuItem from '@material-ui/core/MenuItem';
import FormControl from '@material-ui/core/FormControl';
import Select from '@material-ui/core/Select';


function App(props) {

  const [values, setValues] = React.useState({
    ssn: '',
    phone: '',
    email: '',
    country: '',
    multiline: 'Controlled',
  });

  const [open, setOpen] = React.useState(false);

  const handleOpen = () => {
    setOpen(true);
  };

  const handleClose = () => {
    setOpen(false);
  };

  const handleChange = name => event => {
    setValues({ ...values, [name]: event.target.value });
  };



  return (

    <React.Fragment>
    <div>


        <FormGroup noValidate autoComplete="on">

          <TextField
            id=""
            label="Email"
            value={values.email}
            onChange={handleChange('email')}
            type="email"
            name='email'
          />


          <FormControl>
            <InputLabel htmlFor="country">Country</InputLabel>
            <Select
              label="Country"
              open={open}
              onClose={handleClose}
              onOpen={handleOpen}
              onChange={handleChange}
              inputProps={{
                name: 'country',
                id: 'country',
              }}
            >
              <MenuItem value="">
                <em>None</em>
              </MenuItem>
              <MenuItem value={10}>USA</MenuItem>
              <MenuItem value={20}>Uk</MenuItem>
              <MenuItem value={30}>UAE</MenuItem>
            </Select>
          </FormControl>

        </FormGroup>
    </div>

    </React.Fragment>

  );
}

export default App;

Я хочу, чтобы при выборе страны выбранные должны отображаться в поле, но в настоящее время,он не отображается в поле, даже если я выбрал страну.

Может кто-нибудь сообщить мне, как решить эту проблему?

...