react-router4 路由嵌套 及 Switch使用问题（详细里有贴代码具体描述） ?

需求是：HomeLayout包含了一个公用的的菜单，home、userAdd、bookAdd 这些页面需要展示 组件本身 + HomeLayout，但是 login页面 只需要展示 Login 。

用的是 react-router-dom 4.2.2

代码1

const Init = () =>
  
    
      
      
      
    
    
  ;
复制代码

代码1：router 4 以前的代码是这么写，可以实现功能

代码2

const Init = () =>
  
    

      
        
        
        
      
      
    
  ;
复制代码

代码2：我改造成上面的内容后，在 login 页面，会展示 HomeLayout 和 Login

代码3

const Init = () =>
  
    
      
      
        
        
        
      
    
  ;
复制代码

代码3： 能满足我的需求，login 页面不会展示 HomeLayout，只展示 Login

代码4：

const Init = () =>
  
    
      
        
        
        
      
      
    
  ;
复制代码

代码4：login 页面，只展示 HomeLayout，没有展示 Login

问题1：我用了 Switch 后，发现书写顺序会影响 login 页面的展示（代码3 和 代码4），这里不理解，希望大神能帮忙解释下。

问题2：代码3 虽然能实现我的需求，但是不知道这种写法是不是合理的，如果不太优雅，能否提供一个比较优雅的写法

转载于:https://juejin.im/post/5b03b59d6fb9a07aaa11969d