Day13-尚品汇-微信支付业务上

提纲挈领：

1.安装qrcode插件：

2. 如何使用这个插件，看看代码：

1》.引入

2》在open弹框的地方也就是遮罩层加上这个QRCode.toDataURL(参数)

1）需要传的参数就是codeUrl

 2）观察一下这个函数调用后返回的是什么东西？

 2）----的效果图：

3）但是我们需要的是promise的成功的结果：

 这个promise成功的结果其实是一个地址，点击之后跳转到一个二维码图片

 4）继续修改代码： 

4)----的效果图：

3.开始分析：我们是需要知道后台告诉我们支付的成功与失败的。支付成功有跳转路由，失败会有提示信息。故我们需要向后台发请求，并且要一直发请求。因为支付是由用户决定的，它不可能只发一次请求。你咋决定它只发一次请求，肯定是一直发告诉我们到底有没有支付成功？

4.它有一个查询支付订单状态的接口：

1》博主文档：

2》写api接口（获取支付订单状态） 

1）在api文件夹的index.js里面： 

2）在Pay组件里面：

补充一点：当你的二维码展示出来，你就要做一件事长轮询，

 所以要用到定时器，但是定时器很恶心，当你用完之后，记得要清除掉

在组件pay里面：

1

2.他会一直发请求，问你支付成功了吗？支付成功了吗？支付成功了吗？ 

3.继续优化代码：

4.把静态组件paySucuess放进去项目中：

1》

 2》在roueter.js里面配置路由：

5.目前阶段的效果图：

6.所以这两个按钮点击后应该要处理一些业务逻辑才对

1》官方文档有：

 2》

 

 3》

4》在 Pay里面继续优化代码：【关闭配置项的优化。】

 4》---的效果图：

1）当你点击“支付遇见问题”（取消）按钮的时候

图1：

图2：

图3：

 

 2）当你点击“已支付”（确定）按钮的时候