LocaleLink
- [
locale
] (String): A locale string, e.g.id-id
,en-id
, etc. - [
passHref
] (Boolean): Passes href to<a>
child that doesn't have href attribute. - [
prefetch
] (Boolean): Allows all the future interaction paths of your app to be instant. - [
replace
] (Boolean): Uses replace state instead of the default push state. - [
shallow
] (Boolean): Allows changing URL without runninggetInitialProps
.
import LocaleLink from 'soya-next/link';
export default () => (
<LocaleLink href="/">
<a>Home</a>
</LocaleLink>
);
import LocaleLink from 'soya-next/link';
const PostLink = () => (
<li>
<LocaleLink as={`/p/${props.id}`} href={`/post?title=${props.title}`}>
<a>{props.title}</a>
</LocaleLink>
</li>
);
export default () => (
<nav>
<ul>
<PostLink id="hello-nextjs" title="Hello Next.js" />
<PostLink id="learn-nextjs" title="Learn Next.js is awesome" />
<PostLink id="deploy-nextjs" title="Deploy apps with Zeit" />
</ul>
</div>
);
import LocaleLink from 'soya-next/link';
import { withLocale } from 'soya-next/i18n';
const translations = {
'id-id': {
country: 'Indonesia',
language: 'Bahasa',
},
'en-id': {
country: 'Indonesia',
language: 'English',
},
'en-sg': {
country: 'Singapore',
language: 'English',
},
};
export default withLocale(({
siteLocales = ['id-id', 'en-id', 'en-sg']
}) => (
<div>
{siteLocales.map(locale => (
<LocaleLink locale={locale}>
<a>{translations[locale].language} ({translations[locale].country})</a>
</LocaleLink>
))}
</div>
));
import LocaleLink from 'soya-next/link';
export default () => (
<LocaleLink
href="/"
+ passHref
>
<a
- href="/"
>
Home
</a>
</LocaleLink>
);
Last modified 4yr ago