Time-tracking used JS,CSS, HTML, React

Community feedback

• 

  Daniel•120

  @dvenomb98Posted about 2 years ago

  To your question:

  Set state that you can pass to components.

  For example:

  const [selected, setSelected] = useState("day")

  then you change a style of a button based on selected state.

  I use tailwindCSS for simpler work but u can do it via style attribute.

  const buttons = [{value: "day", label: "Daily"}, {value: "week", label: "Weekly"}, {value: "month", label: "Monthly"}, ]
  
  <div>
  {buttons.map(({value, label}) => (
  
  <button 
  className={`${selected  === value ? "bg-red" : "bg-neutral"} text-3xl`}
  onClick={() => setSelected(value)}>
  {label}
  </button>
  
  ))
  </div>
  

  Marked as helpful

  0

  ---

  

  Galina Kostina•150

  @Galina1512Posted about 2 years ago

  @dvenomb98 Thanks a lot! You helped me a lot!

  1