CODEWITHSUNDEEP
javascriptsqlreactjsexpress
Benjamin Jenne
Benjamin Jenne

Reputation: 39

TypeError: undefined is not a function with React and Express

I am trying to output the contents of this array to my web page using react and express:

[{"LocationName":"LIBERTY DOGS","Address":"105 Greenwood Ave N, Seattle WA","Available":"Y"},{"LocationName":"FREEDOM DOGS","Address":"105 Greenwood Ave N, Seattle WA","Available":"Y"}]

I keep getting an 'Unhandled Rejection (TypeError): undefined is not a function (near '...this.state.vendors.map...')'

Here is my script in React to communicate with my backend and to display it on my web page:

import React from "react";
import { Component } from "react";
// import VendorRenderBox from './VendorRenderBox';
import AdminSideNav from "../components/AdminSideNav";
import { Container, Row, Col } from "react-bootstrap";

class AdminPage extends Component {
  constructor() {
    super();
    this.state = {
      vendors: []
    };
  }
  componentDidMount() {
    fetch("http://localhost:3000/admin/vendors/")
      .then(res => res.json)
      .then(vendors => this.setState({ vendors }));
  }
  render() {
    return (
      <Container fluid>
        <Row>
          <Col xs="4" sm="3" md="3" lg="2" xl="2" style={{ paddingLeft: "0" }}>
            <AdminSideNav />
          </Col>
          <Col
            xs="8"
            sm="9"
            md="9"
            lg="10"
            xl="10"
            style={{ paddingTop: "75px" }}
          >
            <h6> Active list of vendors: </h6>
            <ul>
              {this.state.vendors.map(vendor => (
                <li key={vendor.LocationName}> {vendor.Address} </li>
              ))}
            </ul>
            {/* <AdminRenderBox /> */}
          </Col>
        </Row>
      </Container>
    );
  }
}

export default AdminPage;

Upvotes: 1

Views: 59

Answers (1)

richard nelson
richard nelson

Reputation: 265

execute the json() method:

  .then(res => res.json())

instead of 

  .then(res => res.json)

Upvotes: 1

Related Questions