我了解到像 React Router(https://github.com/ReactTraining/react-router)这样的SPA路由库有助于解析URL并将应用程序放入状态机的相应状态中。
除此之外,路由还有什么其他作用吗?
首先,为什么需要路由?
为什么URL如此重要?例如,在桌面应用程序中没有URL,那么在Web应用程序中URL有什么大不了的呢?
我了解到像 React Router(https://github.com/ReactTraining/react-router)这样的SPA路由库有助于解析URL并将应用程序放入状态机的相应状态中。
除此之外,路由还有什么其他作用吗?
首先,为什么需要路由?
为什么URL如此重要?例如,在桌面应用程序中没有URL,那么在Web应用程序中URL有什么大不了的呢?
我也有这个问题:“为什么我们需要路由?”你可以完全不使用路由编写应用程序。代码可能会变得混乱,但这并不是不可能的。
我使用路由的最大原因是,如果用户点击浏览器的“后退”按钮(同样适用于“前进”按钮),他们将无法在应用程序内导航。用户可能希望使用他们之前加载的不同“页面”的历史记录在应用程序内导航。相反,他们将被扔出Web应用程序。单击刷新按钮也会将它们抛到应用程序的根目录。
从用户的角度来看,它是一个常规的Web应用程序(他们不需要知道它是如何设计的:SPA还是其他方式),它应该像任何Web应用程序/网站一样工作。路由确保了这一点,不是吗?
这是一个非常好的问题,但我认为它没有被讨论得足够多。简短的答案是,在单页Web应用中,通常不需要使用路由。如果您正在构建的应用程序不需要其页面被Google索引,并且您不关心或不希望用户能够书签页面,那么就没有必要实现路由。
在SPA中,路由会增加额外的复杂性和工作量,因此如果可以避免使用它,应该尽量避免。当然,像Angular和React这样的现代框架提供了使路由变得更容易的功能,但即使如此,有些事情可能仍然很难用路由来完成,例如在页面之间进行动画切换。
一个适合使用无需路由的Web应用程序的好例子是多页表单,您想要控制用户的通过并可能防止他们返回到已经失效的页面。使用路由实现这样的表单将是一场噩梦,因为您必须防止用户在其历史记录中访问某些页面。
要理解SPA中的路由是什么,问问自己是有用的。很容易把它想象成一个“网页”,但实际上它是一个状态,当你在不同的路由之间导航时,你真正做的是在不同的应用程序状态之间导航。应用程序外观在不同状态之间可能会改变,但这只是次要的。所以路由的作用是为用户提供返回应用程序特定状态的手段。 只有在希望用户能够返回应用程序特定状态时,才应该在SPA中实现路由。 另一种更有用的做法是实现撤消和重做机制。yourappurl.com/profile/userid/
将加载具有与userid相对应的正确用户配置文件的SPA的配置文件部分。这可以在您提供的GitHub示例中看到。<Router history={browserHistory}>
<Route path="/" component={App}>
<Route path="about" component={About}/>
<Route path="users" component={Users}>
<Route path="/user/:userId" component={User}/>
</Route>
<Route path="*" component={NoMatch}/>
</Route>
SPA是指通常有一个index.html作为“主视图”,然后根据路由,使用React、AngularJS等框架添加/删除index.html的某些部分。
我时不时会有同样的问题。
我想说,在单页应用中,路由器是一个组件层次结构助手。
正如@tech4242所指出的那样,在iOS中我们没有像segue这样的东西。那么如果我们不使用路由器来帮助用户导航,我们应该使用什么呢?我们在这里讨论的是单页应用程序。因此,我们可以在存储或状态中管理这个问题。是的,这是可行的,但不是首选。
试着从使用基于组件的库(React或Vue)的角度来考虑这个问题。使用路由器帮助我们为特定路由使用某个组件。当用户在不同的路由之间来回移动时,我们依赖路由来告诉我们显示哪个组件。我们只需将组件与特定路由耦合在一起,这使得我们的根组件(通常称为App)清晰、易于维护和可读性高。如果没有路由器,根组件或状态将变得混乱且难以维护。