react-router-redux-dom-link

react-router-dom's Link component equivalent for react-router-redux.

Table of Contents

• Install
• Usage
• API
• Contribute
• License

Install

If you haven't already please setup your store and router like it is suggested in the react-router-redux README

yarn add react-router-redux-dom-link

or

npm i --save react-router-redux-dom-link

Usage

import Link from 'react-router-redux-dom-link';

export default const AboutLinkComponent () => (
    <Link to="/about">Your a-tag content</Link>
);

API

Note: You could use all HTMLAnchorElement properties along with specific Link properties as well.

• replace
  Type: boolean
  Default: false
  Description: Whether to push or replace the url provided to to in the browser history.
  Example:

  import Link from 'react-router-redux-dom-link'
  
  export default const AboutLinkComponent () => (
      <Link to="/about" replace>This link replaces the current URL</Link>
  )

• to
  Type: string
  Description: The destination path of the Link. If handled by component the component code this path gets pushed/replaced into the browser history. If handled by the browser this path will be handled like if you had provided it to the href attribute.

  Example:

  import Link from 'react-router-redux-dom-link'
  
  export default const AboutLinkComponent () => (
      <Link to="/about">Simple link</Link>
  )

  or

  Type: { hash?: string, pathname?: string, search?: string, state?: any }
  Description: Object that describes the destination path. It can have following properties:

  • pathname: A string representing the path to link to.
  • search: A string representation of query parameters.
  • hash: A hash to put in the URL, e.g. #a-hash.
  • state: State to persist to the location.

  Example:

  import Link from 'react-router-redux-dom-link'
  
  export default const UserLinkComponent () => (
      <Link 
          to={{
              pathname: '/users',
              search: '?sort=name',
              hash: '#the-hash',
              state: { fromDashboard: true }
          }}
      >
          User link
      </Link>
  )

Contribute

PRs welcome.

License

MIT © Mathis Wiehl