Navigate to another path with redux-simple-router

Question

I'm trying to navigate to another path with redux-simple-router. Here's my component fragment (see handleSubmit method):

import React, { Component } from 'react'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'

import * as actionCreators from 'redux-simple-router'

@connect(
  state => state,
  dispatch => bindActionCreators(actionCreators, dispatch)
)
export class Header extends Component {
  constructor(props) {
    super(props)
    this.handleSubmit = this.handleSubmit.bind(this)
  }

  handleSubmit (e) {
    e.preventDefault()
    this.props.pushPath('/#/admin/users' + (this.state.searchInput !== '' ? '?query=' + this.state.searchInput : '') )
  }

  ...
}

Instead of taking me to the specified path, this dispatches UPDATE_PATH 2 to 4 times, than refreshes the page and takes me to http://localhost:3000/?#/home. What am I missing? What is the proper way to navigate to pages? Is there an example on the web that does page navigation on event?

Answer 1

I have not seen many examples of pushPath. Why not use the router?

handleSubmit (e) {
    e.preventDefault()
    this.context.router.push('/admin/users' + (this.state.searchInput !== '' ? '?query=' + this.state.searchInput : '') + id);
}