ant*_*pug 6 javascript navigation asynchronous code-structure
上下文
单页/ ajax网络应用程序
基本代码结构
LocationManager(负责更新浏览器哈希并将应用程序位置切换到其他区块)
页面/平铺流程
基本信息>家庭信息>车辆信息>购买选项>查看订单>输入付款和提交
问题
当用户从"购买选项"导航到"审阅订单"时,将进行长时间(5-8秒)的服务调用以计算订单详细信息.在呼叫解决后,回调旨在将用户导航到"查看订单"页面.问题是,如果用户在此期间点击回来并返回到家庭信息,一旦通话结算,他们将"自动"带到审核订单.非常尴尬的用户体验.
限制
取消呼叫不是一种选择.需要一个解决方案来处理导航.
目前拟议的实施
在进行calculateOrder调用之前保存"currentLocation".将回调中的"currentLocation"传递给setLocation方法作为setStartingPoint.里面的setLocation方法if(intendedStartingPoint === Locationmanager.currentLocation) {//Navigate}
总而言之,如果用户在呼叫进行过程中更改位置,则在呼叫解决时,我们将无法导航,因为用户不希望在此时导航到"查看订单".
这有效,对吗？
捕获
我们在app中有很多地方可以在长时间运行的调用的回调中调用setLocation.这意味着我将不得不使用新参数--wartingStartingPoint更新所有setLocation调用.虽然这对我来说很有意义,但它看起来似乎有可能变得有点混乱.
关于如何清理和集中它的任何想法？
因此,现在用户可以单击"购买选项"页面上的"计算"按钮.然后,您可以显示某种加载指示符(希望如此),并向setLocation('ReviewOrder')连续发送的服务器发送异步请求.应用程序中有很多地方使用此模式.
出现意外(从用户的角度来看)重定向的问题是因为使用这种方法服务器数据检索和UI导航是耦合的.想到的解决方案是将它们分离并setLocation从所有长时间运行的请求延续中删除调用.它可以按以下方式工作.
当用户单击"计算"按钮时,您将启动异步请求,同时立即导航到"审阅订单"页面(从用户体验角度来看这很重要,因为用户现在清楚地了解"计算"按钮导航到"审阅订单").在Review Order页面上,显示一个加载指示器,表示"请等待,大约剩余10秒......"当请求完成时,隐藏加载指示器并显示数据.
通过这种方式,您的用户将拥有一致的用户体验,因为他们知道无论何时他们单击应用程序中的按钮,都会发生同样的事情(他们导航到视图),并且没有令人惊讶的自动重定向.
| 归档时间： |
|
| 查看次数： |
298 次 |
| 最近记录： |