Comment on page
Navigation
A hook that lets you push and pop view components in the navigation stack.
You most likely won't use this hook too often. To push a new component, use the Push Action. When a user presses
ESC, we automatically pop to the previous component.function useNavigation(): Navigation;
import { Action, ActionPanel, Detail, useNavigation } from "@raycast/api";
function Ping() {
const { push } = useNavigation();
return (
<Detail
markdown="Ping"
actions={
<ActionPanel>
<Action title="Push" onAction={() => push(<Pong />)} />
</ActionPanel>
}
/>
);
}
function Pong() {
const { pop } = useNavigation();
return (
<Detail
markdown="Pong"
actions={
<ActionPanel>
<Action title="Pop" onAction={pop} />
</ActionPanel>
}
/>
);
}
export default function Command() {
return <Ping />;
}
A Navigation object with Navigation.push and Navigation.pop functions. Use the functions to alter the navigation stack.
Property | Description | Type |
|---|---|---|
pop* | Pop current view component from the navigation stack. | () => void |
push* | Push a new view component to the navigation stack. | (component: React.ReactNode) => void |
Last modified 1yr ago