之前我们是在 Checkout 控制器的 render 方法里面组织的请求统一下单接口 .. 这次我们把这些代码挪到 pay 这个方法里面 .. 先修剪一下 .. 去掉生成二维码图像的代码 .. 因为 H5 支付不需要使用二维码 .. 再去掉传递给视图的这个 qrcodeUrl ..

回到文件顶部，可以再去掉导入 qrcode 模块的这行代码 .. 再回到 render 方法 ..

删除掉这些注释掉的代码 ..

然后再剪切一下 render 方法里的这些代码 .. 把它们放在 pay 这个方法里面 ..

现在 render 方法只负责显示一个视图 ..

orderToXML

这个 pay 方法里面，有些代码可能会重复用到，所以可以把它们定义成独立的方法 .. 比如在请求支付的时候，需要把要带着的数据转换成 xml 格式的 .. 这块儿代码可能会重复用到 ..

先剪切一下这块儿代码 .. 添加一个 xmlOrder .. 它的值可以用一下 this.orderToXML 这个方法 .. 方法有两个参数 .. order .. 还有 sign ..

再去定义这个方法 .. 名字是 orderToXML .. 方法接收一个 order .. 还有一个 sign .. 把刚才剪切的代码粘贴到这个方法里面 .. 方法再后再 return 转换之后的这个 xmlOrder

xmlToJS

请求微信支付接口返回来的数据是 xml 格式的，这些数据我们得把它转换成 JavaScript 的 object .. 这个转换的过程也会重复用到，所以也可以把它单独放在一个方法里面 ..

剪切一下这块儿代码 ... 再去定义一个新的方法 .. 名字可以是 xmlToJS .. 接收一个 xmlData 参数，表示的就是要转换成对象的 xml 数据 ..

把剪切的代码粘贴到这里 .. 再修改一下 .. 要转换的数据现在是 xmlData .. 就是传递给这个方法的参数的值 ..

转换之后的数据的名字也可以修改的更常见一些 .. 比较就叫它 _data .. 下面这个换成 data ..

方法最后 return 的就是最终转换好的数据，这里就是这个 data ..

在这个 pay 方法里面，可以再用一下 xmlToJS .. 添加一个 data .. 用一下 this.xmlToJS .. 要转换的数据就是请求统一下单接口响应回来的数据 .. 这里就是 wxPayResponse 下面的 data 这个属性 ..