Link
The Link
control provides your component a LinkValue
. You can use the LinkValue
to create a component that:
links to another Makeswift page, opens a URL, or scrolls to another element.
AnchorExamples
AnchorA simple anchor tag
In this example we register an anchor tag <a>
with its href
, target
, and onClick
props controlled by a Link
control.
import { ReactRuntime } from '@makeswift/runtime/react'
import { Link } from '@makeswift/runtime/controls'
function Link({ link }) {
const { href, target, onClick } = link ?? { href: '#' }
return (
<a href={href} target={target} onClick={onClick}>
Click me!
</a>
)
}
ReactRuntime.registerComponent(Link, {
type: 'link',
label: 'Link',
props: {
link: Link(),
},
})
AnchorAPI
AnchorParameters
Parameter | Type | Required | Default | Description |
---|---|---|---|---|
label | string | no | 'On click' | Text for the panel label. |
AnchorProvided value
The Link
control provides a LinkValue
, or undefined
if there's no value set.
AnchorTypes
type LinkValue = {
href: string
target: '_blank' | '_self' | undefined
onClick(event: MouseEvent<HTMLElement>): void
}