Navigation
Anchor
Storybook
Anchor
Storybook
With the Anchor component you can create links with customizable properties and support for custom components.
Imports
The first alternative is recommended since they can reduce the application bundle.
1import Anchor from 'dd360-ds/Anchor'
1import { Anchor } from 'dd360-ds'
Usage
1import Anchor from 'dd360-ds/Anchor''
2
3<Anchor>This is an example</Anchor>
To
With the prop to you can redirect to the url you need
1import Anchor from 'dd360-ds/Anchor'
2
3<Anchor to="/docs/navigation/anchor">This is an example with the prop to</Anchor>
4
As
With the prop as you can add the Link of react router dom.
1import Anchor from 'dd360-ds/Anchor'
2import { Link } from 'react-router-dom'
3
4<Anchor as={Link} to="/docs/navigation/anchor">
5 This is an example with the prop as
6</Anchor>
7
API Reference
Name | Types | Default |
---|---|---|
"to" | string | - |
"as" | ComponentType<any> | - |
"className" | string | - |
"children" | ReactNode | - |
"..." | HTMLAnchorElement | - |