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

    微信小程序生活类蓝色按钮手机号登录页面设计制作开发教程

    2018-07-25 09:48 来源/作者:懒人模板 分类:小程序教程  « »
    本文给大家带来的是微信小程序生活类蓝色按钮手机号登录页面设计制作开发教程,制作好以后效果图如下:
    一、wxml页面代码如下:
    <!--pages/login/login.wxml-->
    <view class="login-container">
    
      <view class="section-container">
        <view class="common-text">手机号</view>
        <input class="common-input" maxlength="11" type="number" data-type="phone" bindinput="bindKeyInput" placeholder="请输入手机号/互联网+服务账号" />
      </view>
    
      <view class="section-container">
        <view class="common-text" >密码</view>
        <input class="common-input" password type="text" data-type="pwd" bindinput="bindKeyInput" placeholder="请输入密码" />
      </view>
    
      <view class="btn-area">
            <button class="btn" type="default" style="background:#0164a6; color:white" bindtap="tapBtnLogin">登录</button>
          </view>
    </view>

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