How to load data into an input by filling in another Input with React

I have updated the Code. Here I have a functional Select Autocomple showing the list of records from DB "Register". Selecting a Code Automatically fills in the Input Name. The same thing I want to do but with the no, I want to call more than two values like this in the image and in select it is only Label and Value and it does not allow me some properties either.

class Register extends Component {
  state = {
    status: "initial",
    data: [],
    name:'',
    code:''

  }
       componentDidMount = () => {
     this. getInfo()
     }

  getInfo= async () => {
    try {
      const response = await getAll('register')
      console.log(response.data)
      this.setState({
        status: "done",
        data: response.data

      });
    } catch (error) {
      this.setState({
        status: "error"
      });
    }
  };

      handleChange = (selectedOption) => {
        this.setState({
            selectedOption,
            name:  selectedOption.value
        });

  render() {
//show Name and code on Select from Register
     const data = this.state.data.map( st => ({value: st.Name, label: st.Code}));
        return (
        <Container>
          <RowContainer margin="1px" >
            <ColumnContainer margin="10px">
              <h3>Info</h3>
              <label>Code</label>
               <Select 
                            width='215px'
                            value={selectedOption}
                            onChange={this.handleChange}
                            options={data}
                            name={"Code"} 
                            />
              <label>Name</label>
              <Input
                width='150px'
                type="text"
                name={"Name"} 
                placeholder="Name"
                value={this.state.name} />
            </ColumnContainer>
          </RowContainer>
        </Container>

        )
      }
    };

 export default Register;

reactjs