React js 和 apexcharts Unhandled Rejection TypeError Cannot read 属性 'length' of undefined

Question

我将 apexcharts 与 react js 和 hibernate 结合使用，所以这是方法：后端 spring 引导：

   @GetMapping("/pieone")
    public String pieone()
    {Iterable<Closerfprfx> d =  cls.findAllDesign();
        Gson gson = new GsonBuilder().setPrettyPrinting().create();
        String jsonStr= gson.toJson(d);
        return jsonStr;}

这是我前端的代码：

 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>


      );
    }
  }

请问我应该如何解决这个错误并获得带有 json 数据的动态图表 js，我希望在我的图表中显示处于 Json 模式的数据以显示动态数据

Answer 1

您正在覆盖此处的状态：

this.state = {
    series: this.state = {
        dataL : []      
    },

React js 和 apexcharts Unhandled Rejection TypeError Cannot read 属性 'length' of undefined

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

charts

hibernate

reactjs

spring-boot

apexcharts