Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to fix days.map is not a function error

My map function is,

 days.map((val)=>val)

when I consoling days prop it gives me,

  [Array(7)]
  0: (7) ['', '', '', 'Wednesday', '', '', 'Saturday']
  length: 1

Hence days is an array,so why this error occures?

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

Below is the image of console.log()
[1]: https://i.stack.imgur.com/XRQrr.png

This is the component in which I am using the days Prop..

import * as React from 'react';
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
import TableCell from '@mui/material/TableCell';
import TableContainer from '@mui/material/TableContainer';
import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow';
import Paper from '@mui/material/Paper';
import {
    Card,
    CardMedia,
    CardActions,
    Icon,
    Grid,
    Radio,
    Button,
    RadioGroup,
    FormControlLabel,
    Select as MuiSelect,
    MenuItem,
    FormControl,
    InputLabel,
    IconButton,
    CircularProgress,
    Divider,
    Snackbar, Alert, Typography
} from '@mui/material';

function SpecialPriceTable({
    tableData,
    days
}) {
    return (

        <TableContainer component={Paper}>
            <Table sx={{ minWidth: 650 }} size="small" aria-label="a dense table">
                <TableHead>
                    <TableRow>
                        <TableCell align="right">Start Date</TableCell>
                        <TableCell align="right">End Date</TableCell>
                        <TableCell align="right">Recurrence</TableCell>
                        <TableCell align="right">Price Type</TableCell>
                        <TableCell sx={{ pr: 3 }} align="right">Pice</TableCell>
                    </TableRow>
                </TableHead>
                <TableBody>
                    {tableData.map((data, index) => (
                        <TableRow
                            key={index}
                            sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
                        >
                            <TableCell align="right">
                                {data.start_date}
                            </TableCell>

                            <TableCell align="right">
                                {data.end_date}
                            </TableCell>

                            {/* <TableCell align="right">
                                {data.recurrenceType === 1 ? 'All day' : data.recurrenceType === 2 ? 'Weekend(Every Saturday and Sunday)' :
                                    data.recurrenceType === 3 ? days.map((item) => item.join(' ')) : ''}
                            </TableCell> */}

                            {console.log(days[0].map(val=>val))}

                            <TableCell align="right">
                                {data.priceType === 0 ? 'Whole' : data.priceType === 1 ? 'Per Person' : data.priceType === 2 ? 'Per Hours' : ''}
                            </TableCell>

                            <TableCell sx={{ pr: 3 }} align="right">
                                {data.price}
                            </TableCell>
                        </TableRow>
                    ))}
                </TableBody>
            </Table>
        </TableContainer>

    )
}

export default SpecialPriceTable

Thanks,any suggestion accepted..

>Solution :

I cannot know how your days property is initialized based on the code snippet.
Maybe somewhere is it initialized as an object not as an array and then somehow it is converted to array.

Please check the initialization of your days property and change that.
You can also add this check Array.isArray(days)

<TableCell align="right">
 {data.recurrenceType === 1 ? 'All day' : data.recurrenceType === 2 ? 'Weekend(Every Saturday and Sunday)' :
 data.recurrenceType === 3 ? (Array.isArray(days) ? days.map((item) => item.join(' ')) : '-') : ''}
                            </TableCell>
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading