Warning: Failed prop type: The prop `to` is marked as required in `Link`, but its value is `undefined`

Question

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import { Jumbotron, Grid, Row, Col, Image, Button } from 'react-bootstrap';
import './Home.css';

export default class Home extends Component{
render() {
    return (
        <Grid>
            <Jumbotron>
                <h2>Welcome to Judic-O Couture.io</h2>
                <p>Understang the basics of react, react-bootstrap & react-router-dom.</p>
            </Jumbotron>
            <Link>
                <Button bsStyle="primary">About</Button>
            </Link>
        </Grid>
    );
  };
};

Cant really see my error but I know there is a bug in it. I've gone to the link tag because thats where the error pointed to in the react-router-dom

Answer 1

In Link you have to add "to", if you are not really using the router for anything you shouldn't use Link, but if for some reason you need it, then do it like this

<Link to="/#"><Button bsStyle="primary">About</Button></Link>

Again, if you are really using this to the router About you should use <Link to="/your-path" or whatever the route you want to using.

Update: I still don't understand why you have <button> inside your link. If for some reason you need a function, you can add onClik to the Link, and if it's for design purpose, you can add className='my-class'