1

I just started React. I am creating a dashboard where i can see skills (skill_name and skill_percentage ). i used for that Reactjs, bootstrap and Google Chart (Donut chart). but I'm not able to manipulation of data like. Update, remove and add new item(skill)

I created class component in main page.

state data (skill & percent)

  chartData: [
    ["Sills", "Percent"],
    ["Skill_name_1", 40],
    ["SKill_name_2", 10],
  ],

i sent in

<Donut data={this.state.chartData} />

google chart component are

import React from "react";
import ReactDOM from "react-dom";
import Chart from "react-google-charts";
 
const options = {
   title: "",
   pieHole: 0.5,
   is3D: false,
};

const Donut = (props) => {
   {
   return (
      <div className="App">
          <Chart
             chartType="PieChart"
             width="100%"
             height="400px"
             data={props.data}
             options={options}
            />
        </div>
       );
     }
  };
export default Donut;

Here, I want to create new item (skill) in data. I want to perform CURD operation in that. please suggest me some reference to do it.

Thanks...

Palwesh Sahu
  • 43
  • 9
  • Have a look at [useState](https://reactjs.org/docs/hooks-state.html) it helps you to update components based on the state it receives – Reyno Jul 08 '20 at 11:56
  • I'm new in react if you have any reference, blog, link please send me it I will try into that. – Palwesh Sahu Jul 08 '20 at 11:58
  • You could just click the link in my previous comment or quickly google for "how to use useState in react?". But here you go a [quick explanation](https://www.youtube.com/watch?v=mxK8b99iJTg) – Reyno Jul 08 '20 at 12:05

0 Answers0