How to use component props to put on an href on a prop?

JavaScript
1

I want to use 2 buttons in a component to take props and use them elsewhere… I am using Nextjs…

What would be the correct syntax to add the props?

The component goes something like this:

function Buttons(props) {
  return (
    <div>
      <div className="row">
        <div className="col-md-9">
          
          <div className="col-md-12 centering-btn">
            <Link href={props.previous}>
              <a
                className="btn btn-info d-flex justify-content-center"
                target="blank"
              >
                Previous
              </a>
            </Link>
            <Link href={props.next}>
              <a
                className="btn btn-info d-flex justify-content-center"
                target="blank"
              >
                Next
              </a>
            </Link>
          </div>
        </div>
      </div>
    </div>
  );
}

export default Buttons;

Now, how do I add the props on the other side? This doesn’t seem to work:

<Buttons
previous = "./blog/previous-post"
next =  "./blog/next-post"
 />

What would be the proper syntax?

apparently this doesn’t work either ${./blog/previous-post}

3

Have you tried / instead of ./

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.