欢迎来到懒人模板!我们专注移动互联网,所有模板永久免费下载!
  • 首 页
  • 当前位置:主页 > 小程序教程 >

    微信小程序开发自定义金额红包打赏充值页面设计与制作教程(2)

    2018-05-16 09:29 来源/作者:懒人模板 分类:小程序教程  « »



    一、wxml页面代码如下:
    <!--用户信息  -->
    <view class="user-contont">
        <view class="user-name">
            <image src="{{imageSrc}}"></image>
            <text>{{imageName}}</text>
        </view>
    </view>
    <!--金额  -->
    <view class="moeny">
        <view class="{{index == value ?  'action' : '' }}"  wx:for="{{Marr}}" wx:key="{{index}}" bindtap="actionFn" id="{{index}}" >{{item}}</view>   
    </view>
    <!--其他金额  -->
    <view class="other" bindtap="otherFn">其他金额</view>
    <!-- 确定打赏  -->
    <view class="smreward" bindtap="smReward">确定支付</view>
    <!--遮罩层  -->
    <view class="mask" wx:if="{{close}}">
        <view class="mask-back"></view>
        <view class="mask-text">
            <view class="title">
                <image src="/images/close.png" bindtap="closeFn"></image>
                <text >其他金额</text>
            </view>
            <view class="txmoeny">
                <text>金额(元)</text>
                <input placeholder="请填写您的金额" bindinput="inputFn"/>
            </view>
            <view class="sumbtn" bindtap="sumbtn"><button>塞钱</button></view>
        </view>
    </view>

    点击扫描效果预览免费下载免登陆网盘下载
    标签:
    * 懒人模板承诺:本站所有资源免费下载,无病毒,无弹窗,无干扰链接! 提点建议