Q:

React js and apexcharts Unhandled Rejection TypeError Cannot read property 'length' of undefined

I use apexcharts with react js and hibernate so this is the method :
Backend spring boot :
   @GetMapping("/pieone")
    public String pieone()
    {Iterable<Closerfprfx> d =  cls.findAllDesign();
        Gson gson = new GsonBuilder().setPrettyPrinting().create();
        String jsonStr= gson.toJson(d);
        return jsonStr;}

this is the code in my front end :
 constructor(props) {
      super(props);
 
      this.state = {
      
        series: this.state={
          dataL : []
          
        },
        options: {
          chart: {
            width: 380,
            type: 'pie',
          },
          labels: ['LOST', 'WON'],
          responsive: [{
            breakpoint: 480,
            options: {
              chart: {
                width: 200
              },
              legend: {
                position: 'bottom'
              }
            }
          }]
        },
      
      
      };
    }

  
    async componentDidMount(){
      axios.get("http://localhost:8080/designe/pieone")
      .then(response => response.data)
      .then((data) =>{
        this.setState({dataL : data})
      
      })
    
    }
    render() {
      return (
        

  <div id="chart">
<ReactApexChart options={this.state.options} series={this.state.series} type="pie" width={380} />
</div>

      );
    }
  }

Please what  i should to do to resolve this error and get the dynamic chart js with json data ,
I'm looking to display the data that is in Json mode in my graph to have dynamic data display

A:

You're overriding state here:
this.state = {
      
        series: this.state={
          dataL : []
          
        },

