terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

Update Header.js

Browse source
This commit is contained in:
Guillermo Rauch 2016-12-20 12:44:23 -08:00 committed by GitHub
parent 376661254d
commit 9056116c5b
1 changed files with 14 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
examples/with-prefetching/components/Header.js
View file

@ -1,32 +1,30 @@
import React from 'react'
import Link, { prefetch } from 'next/prefetch' import Link, { prefetch } from 'next/prefetch'
import RegularLink from 'next/link'
// Prefetch using the imperative API
prefetch('/')
const styles = {
a: {
marginRight: 10
}
}
export default () => ( export default () => (
<div> <div>
{ /* Prefetch using the declarative API */ } { /* Prefetch using the declarative API */ }
<Link href='/'> <Link href='/'>
<a style={styles.a} >Home</a> <a>Home</a>
</Link> </Link>
<Link href='/features'> <Link href='/features'>
<a style={styles.a} >Features</a> <a>Features</a>
</Link> </Link>
<Link href='/about'> { /* we imperatively prefetch on hover */ }
<a style={styles.a} >About</a> <RegularLink href='/about'>
</Link> <a onMouseEnter={ () => prefetch('/about') && console.log('prefetching /about!') }>About</a>
</RegularLink>
<Link href='/contact' prefetch={false}> <Link href='/contact' prefetch={false}>
<a style={styles.a} >Contact (<small>NO-PREFETCHING</small>)</a> <a>Contact (<small>NO-PREFETCHING</small>)</a>
</Link> </Link>
<style jsx>{`
a {
margin-right: 10px;
}
`}</style>
</div> </div>
) )