下面去改进一下错误页面的显示 .. 回到 shop index 页面 .. 在页面视图里有个 page .. 它里面的内容是正常情况下显示的东西 .. 这里的这个搜索加载指示器还有搜索栏,可以让它们在任何情况下都显示 .. 剪切一下 .. 把它们粘贴到 render 方法里面 .. 这样不管是正常情况还是出现错误的时候,都会在页面上显示搜索栏还有搜索加载指示器 ..
上面这个 errorPage 定义的是出现错误的时候显示的东西 .. 这里用了一个静态的文字 .. 可以把它换成 this.state.errorPageMessage .. 出现错误的时候可以设置这个 errorPageMessage 的值 ..
然后页面的 state 里面,再添加一个 errorPageMessage ... 默认让它等于空白 ..
下面再找到 fetchData 失败的回调 .. 在这个方法里面添加一个 error 参数 .. 失败的时候设置一下 errorPageMessage 的值 .. 让它等于 error 里的 message ..
再打开定义 fetchData 这个模块的地方 .. 修改一下出问题的时候 throw 的这个错误里的信息的值 .. 换成服务出现问题,请稍后再试。
回到模拟器可以再试一下 .. 停止运行服务 .. 刷新一下模拟器 .. 请求出了问题,页面上就会显示 服务出现问题,请稍后再试 ...
重新再运行一下服务 .. 然后再刷新一下 ... 正常得到了数据以后会显示正常页面上的内容 ...