刷新Redux组件后,在浏览器中出现“无法获取”错误

时间:2016-08-25 14:02:43

标签: javascript reactjs redux

我首先在URL localhost:8080 / productDesc / 433899641上正确渲染以下组件,首次加载从另一个组件导航。 但是,当刷新页面时,浏览器不会加载React并在显示中返回错误消息“无法GET / productDesc / 433899641”并且控制台中没有任何内容可以调试

import React from 'react'

const ProductDesc = (props)=>{

    function test(element,index,array){
      var convertId = Number(productId)
      if(element.id === convertId){
        return true;
      }
    }
    const products  = props.products;
    const productId = props.params.itemId;

    const i = products.findIndex(test);

    const product = products[i];
    console.log(product);

    return (
     <ProductComponent />
    )

}

ProductDesc.propTypes = {
  products: React.PropTypes.array
};

export default ProductDesc;

我的路由如下

  <Provider store={store}>
    <Router history={ history }>
      <Route path="/" component={ App }>
          <IndexRoute component={ ProductsGrid } />
          <Route
            path="/productDesc/:itemId"
            component={ ProductDesc }
          />
      </Route>
    </Router>
  </Provider>

我该如何保持当前状态并重新加载?我正在使用Redux

1 个答案:

答案 0 :(得分:4)

为了在服务器重新加载后继续存在,无论请求的路径是什么,您的服务器都需要通过index.html响应来支持它。否则,请使用hashHistory而不是browserHistory。