API REFERENCE

Link Component

The <Link> component is a React component that allows you to navigate between routes in your application. It is the recommended way to navigate between routes in Rasengan.js.

Usage

to Property

Here's an example of how to use the <Link> component:

TypeScript

JavaScript

src/app/home.page.tsx

tsximport React from "react";
import { PageComponent, Link } from "rasengan";
 
const Home: PageComponent = () => {
  return (
    <div>
      <h1>Home</h1>
      <Link to="/dashboard">Go to Dashboard</Link>
    </div>
  );
};
 
Home.path = "/";
Home.metadata = {
  title: "Home",
  description: "Home Page",
};
 
export default Home;

Passing data via (state) prop

TypeScript

JavaScript

src/app/home.page.tsx

tsximport React from "react";
import { PageComponent, Link } from "rasengan";
 
const Home: PageComponent = () => {
  return (
    <div>
      <h1>Home</h1>
      <Link to="/dashboard" state={{ name: "hello" }}>Go to Dashboard</Link>
    </div>
  );
};
 
Home.path = "/";
Home.metadata = {
  title: "Home",
  description: "Home Page",
};
 
export default Home;

Then, you can access to the state like follow:

jsconst { state } = useLocation();

Properties

Props	Type	Description
`to`	`string`	The path to navigate to
`state`	`any`	Data sent via URL to the destination page

Deploying: Node Server

NavLink Component