display the output of math.max and math.min - reactjs

Question

I want to display the findMax() output in a div but im facing this problem :
'findMax' is not defined no-undef
, 'dataset' is not defined no-undef
Someone suggested that I need to use useState but I'm not sure how to make it work , I would appreciate any help !
const pricedata = {
datasets: [
{
backgroundColor: "#0000",
barPercentage: 2,
barThickness: 5,
data: [1, 10, 30, 7, 42, 12],
label: "Update in prices",
maxBarThickness: 10
},
{
backgroundColor: "#0000",
barPercentage: 2,
barThickness: 5,
data: [11, 70, 18, 17, 24, 12],
label: "Update in prices",
maxBarThickness: 10
}
]
};
function findMax(PRICES) {
if (!PRICES) {
return 0;
}
return Math.max(...PRICES);
}
pricedata.datasets.forEach((dataset) => {
dataset.maxPrice = findMax(dataset.data);
});
pricedata.datasets.forEach((dataset) => {
console.log('max price is', dataset.maxPrice);
});
return (
<div>{findMax(dataset.data)}</div>

Answer 1

There is no 'dataset' variable at the root level of the code. The pricedata variable contains an array called datasets. In your code when you call map, it loops over all the datasets - calling each individual one dataset. That variable name is only "scoped" to be within the map() function.
You can build the DIVs inside a map like this:
// call your findMax() on each element
const divs = pricedata.datasets.forEach((dataset,i) => (<div key={i}>{findMax(dataset.data)}</div>))
// using React, you'll need to surround the divs in a parent div
return <>{divs}</>