0

I am working on react spinners, I am added a simple loader BeatLoader as react-spinners doc say, but i am getting unique "key" prop warning , I know it has not effect my application but it has to solve .

import React from "react";
import BeatLoader from "react-spinners/BeatLoader";

const SelectBoxLoader = Props => {
    return (
        <div className="sweet-loading">
            <BeatLoader
                size={15}
                margin={2}
                color={"#62842C"}
                loading={Props.loading}
            />
        </div>
    );
};

export default SelectBoxLoader;

my jsx file is link that, How can i remove unique "key" prop warning from react-spinners/BeatLoader

full warning -

Warning: Each child in a list should have a unique "key" prop. See https://reactjs.org/link/warning-keys for more information.
    at span
    at EmotionCssPropInternal
    at Loader (http://localhost:8088/_next/static/chunks/pages/ship-for-me.js?ts=1618980005007:101089:47)
    at div
    at SelectBoxLoader (http://localhost:8088/_next/static/chunks/pages/ship-for-me.js?ts=1618980005007:114691:22)
    at form
    at div
    at div
    at div
    at div
    at div
    at ShipForMe (http://localhost:8088/_next/static/chunks/pages/ship-for-me.js?ts=1618980005007:114892:78)
    at div
    at div
    at ShipForMePage
    at div
    at div
    at SiteLayout (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:77713:23)
    at CartProvider (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:80873:77)
    at ProductsProvider (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:81522:73)
    at SettingsProvider (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:81667:73)
    at AuthProvider (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:80677:73)
    at MoveOnApp (http://localhost:8088/_next/static/chunks/pages/_app.js?ts=1618980005007:81967:24)
    at ErrorBoundary (http://localhost:8088/_next/static/chunks/main.js?ts=1618980005007:146:47)
    at ReactDevOverlay (http://localhost:8088/_next/static/chunks/main.js?ts=1618980005007:250:23)
    at Container (http://localhost:8088/_next/static/chunks/main.js?ts=1618980005007:12274:5)
    at AppContainer (http://localhost:8088/_next/static/chunks/main.js?ts=1618980005007:12751:24)
    at Root (http://localhost:8088/_next/static/chunks/main.js?ts=1618980005007:12867:25)

link that

davidhu
  • 9,523
  • 6
  • 32
  • 53
Koushik Saha
  • 357
  • 1
  • 3
  • 11
  • 1
    Can you share the actual full warning, including any stacktrace? Is this an issue in your code, or something in the `BeatLoader`? I see nothing in the [source](https://github.com/davidhu2000/react-spinners/blob/master/src/BeatLoader.tsx) that would indicate there'd be any React key issue there. Are you mapping an array to JSX somewhere? – Drew Reese Apr 21 '21 at 04:37
  • update my question , please check – Koushik Saha Apr 21 '21 at 04:42
  • Check this open issue: https://github.com/davidhu2000/react-spinners/issues/293 it's with the `PulseLoader` but it is essentially the same warning and issue. FWIW it appears to not be an issue in production builds, i.e. warning is only generated in development builds locally. – Drew Reese Apr 21 '21 at 04:46

0 Answers0