My dropdown is not showing but submit button is showing

@CodeKazuko2 wrote:

My dropdown is showing and there is no syntax error but import ReactDOM from ‘react-dom’; is never read.

This is my code below.

import React, { Fragment } from ‘react’;

import ReactDOM from ‘react-dom’;

import { Helmet } from ‘react-helmet’;

import { Link } from ‘react-router-dom’;

import backbtn from ‘…/assets/img/backbtn.png’;

class Setting extends React.Component {

constructor(props) {

  super(props);

  this.state = {value: 'coconut'};



  this.handleChange = this.handleChange.bind(this);

  this.handleSubmit = this.handleSubmit.bind(this);

}



handleChange(event) {

  this.setState({value: event.target.value});

}



handleSubmit(event) {

  alert('Your favorite flavor is: ' + this.state.value);

  event.preventDefault();

}



render() {

  return (

    <Fragment> 

    <Helmet><title>Settings</title></Helmet>

    <div id = "settings">

      <section>

          <div className ="image">              

                <Link to="/"><img src={backbtn} alt="back" /></Link>

          </div>



          <h3>Settings</h3>

          

          <div className="music-container">

            <ul>

            <li>Want to know more about Covid-19?</li>

            <li>Click these link below!</li>

            </ul>        

          </div>        

    <form onSubmit={this.handleSubmit}>

      <label>

        Pick your favorite flavor:

        <select value={this.state.value} onChange={this.handleChange}>

          <option value="grapefruit">Grapefruit</option>

          <option value="lime">Lime</option>

          <option value="coconut">Coconut</option>

          <option value="mango">Mango</option>

        </select>

      </label>

      <input type="submit" value="Submit" />

    </form>

    </section>

    </div>

    </Fragment> 
  );
}

}

export default Setting;

Posts: 1

Participants: 1

Read full topic