【键盘/支付】h5键盘以及拉起微信/支付宝支付功能

这里写自定义目录标题

<div class="container" id="newsInfoPreview" v-cloak>
        <!-- 输入框 以及商户信息,这里从后台拿数据获取对应的商户信息-->
        <div class="monenyBox">
            <div class="logoBox">
                <div>
                    <img class="image" src="http://xiangyin-qipai.oss-cn-beijing.aliyuncs.com/202112/1638343588400.png" alt="">
                </div>
                <div class="shopName">
                    <div class="shangjia" style="color:#333;margin-bottom: 0.35rem;font-weight: bold;">{
  {tenantName}}</div>
                    <div style="font-size: 0.7rem;height: 0.8rem;line-height: 0.8rem;">
                        <span class="shopClass">门店</span><span style="color:#666;padding: 0.05rem 0rem;">{
  {shopName}}</span>
                    </div>
                </div>
            </div>
            <div class="payMoneny">消费金额</div>
            </!--键盘输入的数字金额-->
            <div class="monenyNum">
                <div class="content_num">
                    <div>¥</div>
                    <div v-for="item in inputArray" :key="item" class="content_item">{
  {moneyNum[item-1]}}</div>
                    <div class="blink"></div>
                </div>
            </div>
            <div>
                <p style="color:#999;font-size:0.6rem">为保障您的资金安全,请核实商户信息</p>
            </div>
        </div>
		<!---h5键盘在这里插入代码片-->
        <div class="keyboardbox">
            <div class="numkeyboard">
                <div class="num-area">
                    <div class="row" v-for="(item,index) in numKeybordList" :key="index">
                        <div :class="['item',ite===0?'z':'']" v-for="(ite,idx) in item" 
                        :key="idx" @click="input({num:ite})">{
  {ite}}</div>
                    </div>
                </div>
                <div class="btn-area">
                    <div :class="['item','del']" id="delId"  @click="delNumFun">
                        <img src="http://xiangyin-qipai.oss-cn-beijing.aliyuncs.com/202112/1638428193035.png" style="width: 29px;height: 18px;" alt="">
                    </div>
                    <button class="item" :class="[disabledVisible==true?'confirems':'confirem']" @click="pay" :disabled="disabledVisible">
                        <div>立即</div>
                        <div>支付</div>
                    </button>
                </div>
            </div>
        </div>
    </div>
    
``
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> //拉起微信支付引用的官方接口
    <script src = "https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.min.js"> </scrip
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值