Category : reactjs

Below are the routes in my project <Route exact path="/admin-users" component={User}/> <Route exact path="/admin-events" component={Events}/> <Route exact path="/admin-createEvent" component={CreateEvent}/> <Route exact path="/admin/:id" component={Home}/> <Route exact path="/xx/1" component={Home}/> Iam able to go on regular routes like ‘/admin-users’ but not when they have params in it like ‘/xx/1’. It gives 404 error. I have in my index.php ..

Read more

so I’m currently trying to delete a user from a mySql database on clicking a delete button. The app is Laravel backend, React front end. When I click the delete button, it returns a 404 error ‘DELETE http://localhost:8000/delete/5 404 (Not Found)’ onDelete method: onDelete(user_id) { axios.delete(‘http://localhost:8000/users/delete/’ + user_id) .then((response) => { }) } UserController public ..

Read more

ProductCard import React from ‘react’; import { Card, Container, Row, Col, Button} from ‘react-bootstrap’; import Cart from ‘./Cart’; import ‘./ItemCard.css’; function ProductCard(props){ const addToCart = (props)=>{ console.log("we are in addToCart") }; return( <Card className="card-style" border="primary" style={{widht:’18rem’, flex: 1}}> <Card.Img variant="top" src={props.product.image} /> <Card.Body> <Card.Title>{props.product.name}</Card.Title> <Card.Text>Price: ${props.product.price}, Quantity: {props.product.quantity} </Card.Text> <Button onClick={() => addToCart(props.product.name)} variant="primary">Add to ..

Read more

Im trying to display an image using api axios , the api is retrieving the path image from database but the image is not loading import axios from ‘axios’; class Products extends Component { state={ products:[], }; componentDidMount() { axios.get(`http://localhost/CraveByMarwa/public/api/products`) .then(res => { const products = res.data; this.setState({ products }); }) } render() { return ..

Read more

ProductsCard import React from ‘react’ import { Card, Container, Row, Col, ListGroup, Button} from ‘react-bootstrap’ function ProductCard(props){ return( <div> <Container> <Row> <Col md={3} xs={6}> <Card border="primary" style={{widht:’14rem’}}> <Card.Img variant="top" src={props.product.image}/> <Card.Body> <Card.Title>{props.product.name}</Card.Title> <Card.Text>Price: ${props.product.price}, Quantity: {props.product.quantity} </Card.Text> <Button variant="primary">Add to Cart</Button> </Card.Body> </Card> </Col> </Row> </Container> </div> ) } export default ProductCard Home import Axios ..

Read more

Hi I am creating a web app using create-react-app which consumes endpoints developed in laravel 5. When I make a Delete request using axios to the server, I get this error Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:8000/api/carts/7?api_token=r31blLEFtjvA8Zhhba3K1AD083Yj1NUz8U7nUZZsX24EpW9dmtQ3mnOc4DdV. (Reason: Did not find method in CORS header ‘Access-Control-Allow-Methods’) Whereas, ..

Read more

I am getting this error while calling APIs. Before marking ‘already answered’, please read this. My frontend is in ReactJs and I’m using axios for API requests, backend in Laravel (v5, old project). Each API gives this error: Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response. I have already done the ..

Read more

I am getting this error while calling APIs. Before marking as ‘duplicate’, please read this. My frontend is in ReactJs and I’m using axios for API requests, backend in Laravel (v5, old project). Each API gives this error: Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response. I have already done the ..

Read more