React Router Redux总是显示第一条路线

时间:2018-08-24 07:47:52

标签: javascript reactjs react-router-redux

反应路由器redux始终显示第一条路由。无论我输入哪个网址,它都会呈现第一条路线。

Index.js文件

<ConnectedRouter history={history}>
   <App />
</ConnectedRouter>

App.js文件

export default function App() {
      return (
            <Switch>
              <Route to="/" component={Dashboard} key={1} />;         
              <Route to="/icons" component={Icons} key={2} />;         
           </Switch>
      );
    }

3 个答案:

答案 0 :(得分:2)

使用Switch时,由于Switch匹配并呈现了第一个匹配的路由,因此需要在末尾添加其他路径的前缀的路由。

export default function App() {
      return (
            <Switch>
              <Route to="/icons" component={Icons} key={2} />
              <Route to="/" component={Dashboard} key={1} />              
           </Switch>
      );
    }

而且您不需要在JSX语句末尾使用;

答案 1 :(得分:0)

只需将精确值= {true}添加到Route,默认精确度设置为false,只需查看here

<Route exact path="/" component={Dashboard} key={1} />;         

答案 2 :(得分:0)

这是因为您的示例中的路由配置错误。您需要在第一条路线上添加精确道具。

示例:

    JTextField IDname;
    JButton submit;


    public static Connection getConnection() throws Exception{
        try{
        String driver = "com.mysql.jdbc.Driver";
        String url = "someurl";
        String username = "";some name
        String password = "some password";
        Class.forName(driver);

        Connection conn = DriverManager.getConnection(url,username,password);
        System.out.println("Connected");
        return conn;
        } catch(Exception e){System.out.println(e);}


        return null;
        }


public Implementing() {

        IDname = new JTextField("");
        submit = new JButton("go");
        add(IDname);
        add(submit);
        submit.addActionListener(new ActionListener() {

public void actionPerformed(ActionEvent e) {
        if(e.getSource() == submit) {
        try {
         String id = IDname.getText().toString();
        getConnection();
        ////////NEXT LINE IS THE NPE////////
        for(String string:get(id)){
            System.out.println(string);
        }
//       get(id);
        } catch (Exception e1) {
        // TODO Auto-generated catch block
        e1.printStackTrace();
        }

        }
        }


        });
        setLayout(new GridLayout());
        }

public  ArrayList<String> get(String idname) throws Exception{
        try{
        Connection con = getConnection();
        // You should replace "YourTableName" With table in databace that you work with it
        PreparedStatement statement = con.prepareStatement("SELECT * FROM YourTableName WHERE ppname = '" +idname+"'");
        //If type of your id in database is Int write this code :
        //    int id= Integer.parseInt(idName); 
        //PreparedStatement statement = con.prepareStatement("SELECT * FROM YourTableName WHERE id = " + idName);

        ResultSet result = statement.executeQuery();
}

如果您不对“ /”路由添加完全匹配,则它将始终匹配,因为其他所有路由也都包含/。

我的建议是默认情况下将所有路由定义为精确路由,并且仅在需要时设置非精确路由,例如:

<Switch>
    <Route exact to="/" component={Dashboard} />;         
    <Route to="/icons" component={Icons} />;         
</Switch>