Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

108
Views
State changing but not rendering

Screenshot

I want to render a settings menu onclick when an element is added to my list and disable all other setting menus when one is active. I also have a sample element in a different state and would like to deactivate all setting menus when it is on and have it disabled if a settings menu is on. I am storing the setting states of all elements in an array and in my update function the copy of my setting state is changing but my actual settings state isn't. I think it has to do with my useeffect and when I comment it out my settings state does change but it isn't rendered. It was working before I mapped my chart data, but I am not sure what caused it to stop working as commenting it out still does not render settings.

const [settings, setSettings] = useState([]);
const [sampSettings, setSampSettings] = useState(false);

const updateSettings = (val, index) => {
if(val){
    let copySettingsFalse = [...settings]
    copySettingsFalse[index]=false;
    return setSettings(copySettingsFalse);
}
let copySettingsTrue = settings.fill(false);
copySettingsTrue[index] = true;
console.log(copySettingsTrue)
return setSettings(copySettingsTrue);

};

useEffect(() => {
if (stockList.length>0){
stockList.map((val,index) => {
  // Chart
  setLineData([
    ...lineData,
    {
      labels:trimLineDataHistory[index],
      datasets: [
        {
          label: val.Tick,
          data: trimLineDataHistory[index].reverse(),
          pointRadius: 0,
          fill: false,
          backgroundColor: day ? "#e9dfd4" : "#141e28",
          borderColor: "#52ad59",
        },
      ],
    },
  ]);
  // Settings
  setSettings([...settings, false]);
})}
  return;
},[stockList]);

// Settings
// useEffect(() => {
//   if (settings.includes(true)) {
//     setSampSettings(false);
//   }
//   if (sampSettings === true) {
//     setSettings(settings.fill(false));
//   }
//   return;
// }, [settings,sampSettings]);

  if(stockList.length>1)
  return(
  <>
  {stockList.map((val, index) => {
   const { Tick, Name } = val;
   return(
   <div className="stockItemIcon">
        <BsFillGearFill
         className="gearIcon"
         onClick={() => updateSettings(settings[index], index)}></BsFillGearFill>

             
        <div className={settings[index]?
        (day?"settingsContainerAlt showSettings daySettings":"settingsContainerAlt showSettings nightSettings")
       :(day?"settingsContainerAlt hideSettings daySettings":"settingsContainerAlt hideSettings nightSettings")}>

            </div>)}
            </>)
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

You try to add the "Key" attribute BsFillGearFill tag and also set & update value for it. it may be any value

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!