vue-网页支付 --支付宝和微信支付

1.微信支付

　　网页的微信支付返回的是一串链接，使用qrcode把链接生成二维码让客户扫描

import QRCode from \'qrcode\'
QRCode.toDataURL(res.content)
            .then(url=>{
             　console.log(url,\'生成的为base64的二维码图片\')
            })
            .catch(()=>{
              this.$message.error(\'微信二维码生成失败，请稍后重试\')
            })

2.支付宝

　　网页支付宝支付，接口返回的一段form表单代码，然后提交后会转向支付宝支付页面

　　1.打开支付页面

window.open(\'/order/alipay?orderId=\'+this.orderId,\'_blank\')

　　2.在支付页面调取接口

<div class="form" v-html="content"></div>

data(){
    return{
      orderId:this.$route.query.orderId,
      content:\'\',
      loading:true
    }
  },

mounted(){
    this.paySubmit()
  },

paySubmit(){
      postPayInfo({
        orderId:this.orderId,
        orderName:\'Vue高仿小米商城\',
        amount:0.01,//单位元
        payType:1 //1支付宝，2微信
      }).then(res=>{
        this.content = res.content;
        setTimeout(()=>{
          document.forms[0].submit();
        },100)
      })
    }

在vue中有v-html 来渲染代码，在react中也有

import React from \'react\';

export default class dangderouslySet extends React.Component {
  constructor() {
    super()
    this.state = {
      Html1: \'<div className="dx">这是直接嵌套的html代码</div>\'
    }
  }
  render() {
    return (
      <div dangerouslySetInnerHTML={{__html:this.state.Html1}}></div>
    )
  }
}