Home > Blockchain >  How Do I Change the Style of an Element in a Component When an onClick Event for an Element in a Dif
How Do I Change the Style of an Element in a Component When an onClick Event for an Element in a Dif

Time:02-19

Basically whenever the Add to Basket button in my Product component is clicked, I want the Shopping Bag in the Header component to flash or expand.

Product Component:

import "../styles/Product.css";
import React, { useState } from "react";
import { useStateValue } from "../StateProvider";

function Product({ id, title, image, price, rating }) {
  const [{ basket }, dispatch] = useStateValue();

  const addToBasket = () => {
    dispatch({
      type: "ADD_TO_BASKET",
      item: {
        id: id,
        title: title,
        image: image,
        price: price,
        rating: rating,
      },
    });
  };

  return (
    <div className="product">
      <div className="product_info">
        <p>{title}</p>
        <p className="product_price">
          <small>$</small>
          <strong>{price}</strong>
        </p>
        <div className="product_rating">
          {Array(rating)
            .fill()
            .map((_, i) => (
              <p>           
  • Related