标签: react-router-redux

当 TextInput 获得焦点时，键盘会隐藏提交按钮。如何自动滑动TextInput下方的组件

我有一个在嵌套URL而不是根目录下运行的应用程序。可以说example.com/app。

我在这里阅读到，您可以在React Router 2.x中配置基本名称。

如何在React Router 3.x中做到这一点？

仅供参考，我也在使用react-router-redux包裹。

我对反应本机路由非常困惑。我是react-native的新手，从来没有研究过React.js。我想问一下，react本机应用程序是像angularJs一样的单页应用程序架构吗？在react-native中有很多路由和导航的方法，比如

1 .react-native-router-flux

2.导航器
等多种方式。有人请告诉我这个 SPA 架构是什么，以及在有更多支持的 React-Native 中路由的最佳方式是什么。我想在我的应用程序中制作侧抽屉菜单和选项卡菜单。请帮我 。提前致谢

反应路由器工作正常。但是，如果我添加<Redirect>或调用 from <Link>，则会出现以下异常：

Uncaught 在状态树中找不到router reducer，必须挂载在“router”下

rootReducer.js：

    import { combineReducers } from 'redux';
    import { connectRouter } from 'connected-react-router';
    import counterReducer from './Counter/counter.reducer';
    import sidebarReducer from './Sidebar/sidebar.reducer';

    export default (history) => combineReducers({
        router: connectRouter(history),
        counter: counterReducer,
        sidebar: sidebarReducer,
    });

商店.js：

    import { createBrowserHistory } from 'history';
    import { applyMiddleware, compose, createStore } from 'redux';
    import { routerMiddleware } from 'connected-react-router';
    import createRootReducer from './rootReducer';

    export const history = createBrowserHistory();

    export default function configureStore(preloadedState) {
        const composeEnhancer = …

使用https://github.com/reactjs/react-router-redux/

如果我想基于url查询params重新加载app(Redux)状态是获取state.routing.locationBeforeTransitions.query属性的正确方法吗？

它的工作原理......只是想知道这是否正确.

在我的React/Redux应用程序中,我有一些异步操作.假设用户getData向服务器发起请求.立即GET_DATA_REQUEST被分派和getDataAJAX调用是在它的途中到服务器.

成功或失败后,将相应地分派一个GET_DATA_SUCCESS或多个GET_DATA_FAILURE动作,并将数据呈现给UI.

现在,我希望我的应用程序将历史状态(使用react-router-redux)作为对AJAX回调的反应.意思是,一旦成功,用户被"重定向"到另一个URL(路由),显示依赖于新接收的数据的不同模块.

我意识到在reducer中使用这个功能是一个非常糟糕的主意,因为它不再是纯粹的(URL更改是副作用).

有什么想法吗？

谢谢

我是React的新手,看着这个ReactTraining.我想将我的一些路径设为私有(这样您只能在登录时查看它们).我能够很好地验证用户并将它们引导到新页面,但现在我想"保护"该页面,以便只有在登录后才能访问.我发现了一些似乎使用相同"PrivateRoute"的不同来源 "功能如下.到目前为止,一切似乎都很有效(并且有意义),除了以下代码的"...... rest"部分:

const PrivateRoute = ({ component: Component, ...rest }) => (
  <Route {...rest} render={props => (
    fakeAuth.isAuthenticated ? (
      <Component {...props}/>
    ) : (
      <Redirect to={{
        pathname: '/login',
        state: { from: props.location }
      }}/>
    )
  )}/>
)

我收到以下错误:

Uncaught Error: Cannot find module "./components/Login"
    at webpackMissingModule (router.js:9)
    at Object.<anonymous> (router.js:9)
    at __webpack_require__ (bootstrap 18b9132…:555)
    at fn (bootstrap 18b9132…:86)
    at Object.<anonymous> (index.js:22)
    at __webpack_require__ (bootstrap 18b9132…:555)
    at fn (bootstrap 18b9132…:86)
    at Object.<anonymous> (bootstrap 18b9132…:578)
    at __webpack_require__ (bootstrap 18b9132…:555) …

我正在为一个带有react,redux,react-router和react-router-redux的项目构建一个管理应用程序.React-router是v4.0.0,react-router-redux是v5.0.0-alpha.3(安装npm install react-router-redux@next).我正在尝试的是:

1. 加载应用,
2. 对后端执行异步调用以查看用户是否已登录(存储在cookie中的令牌),
3. 如果用户未登录,则重定向到/login并呈现Login组件.

对于异步操作,我正在使用redux-thunk.

Root.js

import React, { Component, PropTypes } from 'react';
import { Provider, connect } from 'react-redux';
import { Route, Switch } from 'react-router-dom';
import { ConnectedRouter, push } from 'react-router-redux';

import Login from './Login';

const App = () => <h1>Dashboard</h1>;
const NotFound = () => <h1>Not found :(</h1>;

class Root extends Component {

  // use componentDidMount as …

我在我的应用程序中使用 react-router + react-router-redux 。我想要实现的是每次用户单击其中的选项卡时，dashboard它都会将 URL 更改为/dashboard/messages，例如。

但是，使用push('dashboard/' + page), 每次单击选项卡时，它都会附加链接。

我现在的情况：

1. 当前网址是/dashboard。
2. 单击消息选项卡。
3. URL 更改为/dashboard/messages.
4. 单击主页选项卡。
5. URL 更改为/dashboard/messages/dashboard/home.

有什么办法只需更换/dashboard/messages成/dashboard/home当我们点击cliked邮件选项卡后，主页选项卡？

非常感谢！