CODEWITHSUNDEEP
reactjs
Md Mazharul Islam
Md Mazharul Islam

Reputation: 3

TypeError: items.map is not a function

My code problem is that I want to create a token from the backend and add it to my item. Now the page is crashing due to mapping the data.

 <div className='bg-gray-100'>
            <SimpleHeader/>
            <div className='flex justify-center'>
                <h2 className='text-center text-4xl py-5 inline-block border-b-4 border-blue-400 font-bold mb-4'>My Items</h2>
            </div>
            <Link to='/addItems' className='flex justify-center'>
                <button className='px-2 py-1 bg-transparent rounded border-2 border-blue-500 hover:bg-blue-500 hover:text-white duration-200 hover:scale-105'>Add New Item</button>
            </Link>
            <div className='container md:grid grid-cols-3 gap-4 w-full mx-auto p-12'>
            {
                items?.map(item=><MyItem key={item._id} item={item} handleDelete={handleDelete}></MyItem>)
            }
            </div>
        </div>

Upvotes: 0

Views: 431

Answers (1)

R4ncid
R4ncid

Reputation: 7129

try to change it this way

 <div className='bg-gray-100'>
            <SimpleHeader/>
            <div className='flex justify-center'>
                <h2 className='text-center text-4xl py-5 inline-block border-b-4 border-blue-400 font-bold mb-4'>My Items</h2>
            </div>
            <Link to='/addItems' className='flex justify-center'>
                <button className='px-2 py-1 bg-transparent rounded border-2 border-blue-500 hover:bg-blue-500 hover:text-white duration-200 hover:scale-105'>Add New Item</button>
            </Link>
            <div className='container md:grid grid-cols-3 gap-4 w-full mx-auto p-12'>
            {
             items && items.map(item=><MyItem key={item._id} item={item} handleDelete={handleDelete}></MyItem>)
            }
            </div>
        </div>

Upvotes: 1

Related Questions