Click here to Skip to main content
15,867,835 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
Hi Team

I need help, i am getting this issue basically i created a local data using localhost and helper class. When i launch this i get this exception and cant seem to solve it. the problem is on line 9 "Sidebar.js"

What I have tried:

//httpHelper.js
/**
 * This application used for simplifies  requests  component
 * @author:Gcobani Mkontwana
 * @date:15/06/2022
 */

export const httpHelper =() => {
    const customFetch = async(url, options = {})=>{
            const defaultMethod = "GET"
            const defaultHeaders = {
                "Content-Type": "application/json",
                Accept: "application/json",
            }

            const controller = new AbortController()
            options.signal = controller.signal

            
		options.method = options.method || defaultMethod
		options.headers = options.headers
			? { ...defaultHeaders, ...options.headers }
			: defaultHeaders

		options.body = JSON.stringify(options.body) || false
		if (!options.body) delete options.body

		setTimeout(() => {
			controller.abort()
		}, 3000)

		try {
			const response = await fetch(url, options)
			return await response.json()
		} catch (err) {
			return err
		}
	}

	const get = (url, options = {}) => customFetch(url, options)

	const post = (url, options) => {
		options.method = "POST"
		return customFetch(url, options)
	}
        // returning our objects here.
        return{
            get, post
        }

    }


// Sidebar.js
/**
 * Sidebar for shipping information details
 */

import { Sidebar } from '@coreui/coreui';
import React,{Component, useEffect, useState} from 'react';
import {httpHelper} from "./helpers/HttpHelper"
  
export default Sidebar =() => {
// const products
  const Products=()=>{
  const[product, setProducts] = useState(null)

  // url to pass values from the json format.

  const url = "http://localhost:3000/product"
  const api = httpHelper()


  // fetching data as json
  useEffect(()=>{
    getProducts()
  }, [])

  const postProducts = product=>{
    api 

      .post('${url}', {body:product})
      .then(response=>getProducts())
      .catch(err=>console.log(err))
  }

  // get all products information here.

  const getProducts =() =>{
    api
    .get('${url}?_expand=shipping')
    .then(response=> {
      getProducts(response)
    }).catch(err=>console.log(err))
  }

  // our products returns when nothing on json if empty.
  if(!product) return null
  }
   


}
Posted
Updated 15-Jun-22 0:39am
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900