精华内容
下载资源
问答
  • 微信小程序直播播放页面代码live-player标签,可用于微信小程序直播开发
  • 微信小程序的一个登陆注册代码,纯前端实现效果,注册成功进行登陆,列表显示所有用户的名称,点击进入可查看具体的用户信息
  • 微信小程序登录注册界面

    万次阅读 多人点赞 2019-06-02 21:55:21
    微信小程序登录注册界面 第一次接触微信小程序的开发,首先就是从前端的界面开始,我要做的是一个农场管理的微信小程序,大致包括登录注册、主要功能界面这些,这里我就分享一下我的登录注册界面的设计和功能实现...

    微信小程序登录注册界面

    第一次接触微信小程序的开发,首先就是从前端的界面开始,我要做的是一个农场管理的微信小程序,大致包括登录、注册、主要功能界面这些,这里我就分享一下我的登录注册界面的设计和功能实现

    Pages中的代码构成:xxx.js、xxx.json 、xxx.wxml、 xxx.wxss

    首先登录界面

    Login.wxml

    <!-- 农场主登录 -->

    <view class="container">

        <view class='content'>

            <image class="user-avatar" src="/image/touxiang.jpg"></image>

            <input placeholder="账户" class='user-id' bindinput='getUsername' />

            <input placeholder="密码" class='password' bindinput='getPassword' password='true' />

            <button class='login' bindtap='loginClick' hover-class='login-hover'>登录</button>

            <button class='register' bindtap='registerClick' hover-class='register-hover'>新用户请先注册</button>

        </view>

        <view class='triangle3'></view>

        <view class='triangle4'></view>

        <view class='triangle5'></view>

        <view class='triangle6'></view>

    </view>

    这是页面的组建布局设计

    下面要点击“新用户注册”跳转到农场主注册界面,需要进入login.js对按键“登录”和“新用户请先注册”进行页面跳转设置

    Login.js

    Page({

      loginClick: function () {

        wx.navigateTo({

          url: '../farmermain/farmermain',

        })

      },

      registerClick: function () {

        wx.navigateTo({

          url: '../farmerregister/farmerregister',

        })

      }

    })

    接下来每个界面流程都是同样的,按照自己的设计的模式来布置组建按钮,位置大小颜色等,对按钮点击跳转的主要方法就是在.js文件中使用

    wx.navigateTo({

          url: '../xxx/xxx',

        })

    进行跳转

    这只是一些界面相互之间的跳转,没有后台,也没连接数据库等,可以只用于前期的界面的设计,方便更改调整,后期连接后台和数据库时还需要再修改

    展开全文
  • 微信小程序登录界面,有自动登录选项,忘记密码及注册登录表单验证等
  • 微信小程序登录注册——云开发

    千次阅读 多人点赞 2019-05-06 08:25:08
    微信小程序登录注册页面_云开发_调用云数据库 1.界面展示 2.代码 1.云开发初始化 app js //app.js App({ onLaunch: function() { //云开发初始化 wx.cloud.init({ env: 'ljb-7tdjm', traceUser: true }) } ...

    微信小程序登录注册页面_云开发_调用云数据库

    源代码下载https://download.csdn.net/download/lujiebin/11241027

    1.界面展示在这里插入图片描述

    在这里插入图片描述在这里插入图片描述

    2.代码

    1.云开发初始化

    app js

    //app.js
      App({
        onLaunch: function() {
        //云开发初始化
        wx.cloud.init({
          env: 'ljb-7tdjm',
          traceUser: true
        })
      }
     })
    

    云开发初始化,env为自己的云端环境ID

    2.register页面

    wxml

    <!--pages/register/register.wxml-->
    <view>
    <i-input  bind:change='inputName' maxlength="15" title="账号"
     autofocus placeholder="请输入账号" />
    <i-input  bind:change='inputPassword' type="password" 
    maxlength="15" title="密码" autofocus placeholder="请输入密码" />
    <i-button bindtap='register' type="success">注册</i-button>
    </view>
    

    js

    let app = getApp();
    //获取云数据库引用
    const db = wx.cloud.database();
    const admin = db.collection('adminlist');
    let name = null;
    let password = null;
    
    Page({
      data: {
       
      },
     
      //输入用户名
      inputName: function (event) {
        name = event.detail.detail.value
      },
      //输入密码
      inputPassword(event) {
        password = event.detail.detail.value
      },
      //注册
      register() {
        let that = this;
        let flag = false  //是否存在 true为存在
        //查询用户是否已经注册
        admin.get({
          success: (res) => {
            let admins = res.data;  //获取到的对象数组数据
             console.log(admins);
            for (let i = 0; i < admins.length; i++) {  //遍历数据库对象集合
              if (name === admins[i].name) { //用户名存在
                flag = true;
                  break;
              }
            }
            if (flag === true) {    //已注册
              wx.showToast({
                title: '账号已注册!',
                icon: 'success',
                duration: 2500
              })
            } else {  //未注册
              that.saveuserinfo()
            }
          }
        })
      },
      //注册用户信息
      saveuserinfo() {
        let that = this;
        admin.add({  //添加数据
          data: {
            name: name,
            password: password
          }
        }).then(res => {
          console.log('注册成功!')
          wx.showToast({
            title: '注册成功!',
            icon: 'success',
            duration: 3000
          })
          wx.redirectTo({
            url: '/pages/login/login',
          })
        })
      }
    })
    

    const admin = db.collection(‘填写自己的云开发集合名称’);

    2.login页面

    wxml

    <view class="header">
    <text>微平台-学生端</text>
    </view>
    <view>
    <i-input bind:change='inputName' maxlength="15" title="账号"
     placeholder="请输入账号" />
    <i-input bind:change='inputPassword' maxlength="15" 
    title="密码" type="password" placeholder="请输入密码" />
    <i-button bindtap='login' type="primary">登录</i-button>
    <i-button bindtap='register' type="success">注册</i-button>
    </view>
    
    

    js

    // pages/login/login.js
    let app = getApp();
    // 获取云数据库引用
    const db = wx.cloud.database();
    const admin = db.collection('adminlist');
    let name = null;
    let password = null;
    
    Page({
    
      /**
       * 页面的初始数据
       */
      data: {
    
      },
      //输入用户名
      inputName: function (event) {
        name = event.detail.detail.value
      },
      //输入密码
      inputPassword(event) {
        password = event.detail.detail.value
      },
      //登陆
      login() {
        let that = this;
        //登陆获取用户信息
        admin.get({
          success: (res) => {
            let user = res.data;
            // console.log(res.data);
            for (let i = 0; i < user.length; i++) {  //遍历数据库对象集合
              if (name === user[i].name) { //用户名存在
                if (password !== user[i].password) {  //判断密码是否正确
                  wx.showToast({
                    title: '密码错误!!',
                    icon: 'success',
                    duration: 2500
                  })
                } else {
                  console.log('登陆成功!')
                  wx.showToast({
                    title: '登陆成功!!',
                    icon: 'success',
                    duration: 2500
                  })
                  wx.switchTab({
                    url: "../index/index",
                  })
                }
              } else {   //不存在
                wx.showToast({
                  title: '无此用户名!!',
                  icon: 'success',
                  duration: 2500
                })
              }
            }
          }
        })
      },
      register() {
        wx.navigateTo({
          url: '/pages/register/register'
        })
      }
      })
      
    ```中期课程小微小程序https://download.csdn.net/download/lujiebin/11241027源码
    仅供学习交流~~~
    
    
    
    展开全文
  • 主要介绍了微信小程序 注册页面的相关资料,需要的朋友可以参考下
  • 微信小程序动态修改页面标题setNavigationBarTitle

    万次阅读 多人点赞 2017-12-22 14:27:22
    微信小程序是可以动态修改页面标题的。 首先我们来看看静态是怎么实现的 在对应页面的json文件里面加入下面代码就可以实现了{ "navigationBarTitleText": "素材图库" }效果图如下: 其他动态的也是十分简单...

    微信小程序是可以动态修改页面标题的。
    首先我们来看看静态是怎么实现的
    这里写图片描述
    在对应页面的json文件里面加入下面代码就可以实现了

    {
      "navigationBarTitleText": "素材图库"
    }
    

    效果图如下:
    这里写图片描述
    其他动态的也是十分简单,毕竟是提供好了的接口,我们调用一下就行了。接口嘛,那就要操作对应的js文件咯。参考地址

      quwei: function () {
        wx.setNavigationBarTitle({
          title: '趣味表情' 
        })
      }
    

    点击的时候触发quwei这个函数就可以了。
    这里写图片描述
    好的,这样就实现了。冬至快乐喔!

    展开全文
  • 微信小程序登录欢迎页面demo

    万次阅读 2018-07-29 12:24:34
    之前有用过小程序的欢迎页面,也是GitHub上找到的一个案例。近期有用到,简单的分享一下,可以让有需要的人避免重复造轮子和更好的创新学习。 (一)效果预览 ...微信小程序商城,微信小程序微店...

    之前有用过小程序的欢迎页面,也是GitHub上找到的一个案例。近期有用到,简单的分享一下,可以让有需要的人避免重复造轮子和更好的创新学习。

    (一)效果预览

    直接看效果如何,是否符合您的要求,不符合直接结束浏览,避免浪费您的时间。
    运行结果图

    (二)代码目录

    简单实用,直接下载工具打开预览,代码下载
    代码目录

    (三)参考文献

    微信小程序商城,微信小程序微店

    展开全文
  • 主要介绍了微信小程序和H5页面间相互跳转代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
  • 微信小程序常见模板源代码,包括源代码成功运行截图,不可多得的学习模板。
  • 我现在在自学开发小程序的时候,发现自己不会小程序的登录代码编写,所以就找了其他人写的代码,但是基本都是差不多的,下面是我找的比较详细的微信小程序登陆代码
  • 最近在进行微信小程序中的页面开发,其实在c++或者说是js中都会出现这种情况,就是相同的代码会反复出现,这就是进行一定的封装,封装的好处就是可以是程序中在于减少一定的代码量,并且可是使代码结构更加清晰。...
  • 微信小程序代码-小程序页面生成器.zip,小程序模板代码,可以直接从源码里粘贴复制过来,虽然这样做不利于自己独立编写代码
  • 微信小程序实现朋友圈页面。UGC发布,包含获取用户授权信息。
  • 微信小程序版的登录注册

    万次阅读 多人点赞 2018-07-06 12:31:14
    使用微信小程序进行用户的登陆注册功能 使用了weui进行 1、登录界面展示: 2、注册界面展示 3、代码列表展示: 4、核心功能 (1)用户名密码错误: (2)登录是按照用户登录名来查找的,...
  • 零基础入门微信小程序开发

    万次阅读 多人点赞 2018-07-03 02:45:07
    本课程是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件、页面样式文件、JavaScript 的基本知识并以指南针为例对基本知识进行扩展,另外加上开发工具的安装...
  • 微信小程序开发【前端+后端(java)】

    万次阅读 多人点赞 2018-07-13 22:19:46
    现在微信小程序越来越火了,相信不少人都通过各种途径学习过微信小程序或者尝试开发,作者就是曾经由于兴趣了解开发过微信小程序,最终自己的毕业设计也是开发一个微信小程序。所以现在用这篇博客记录我之前开发的...
  • 此源代码为视频 WXOPEN Club 出品的免费视频教程配套源代码。 ...013-第二章第三节-微信小程序项目实战之用户登录模块布局 014-第二章第四节-微信小程序项目实战之用户登录网络请求 015-第二章第五
  • 微信小程序实现登录页面

    万次阅读 多人点赞 2019-05-06 08:51:08
    wxml文件: <view class="container"> <view class="login-icon"> ... ---------------长按二维码关注程序媛姐姐公众号有更多彩蛋哦---------------  
  • 微信小程序选项卡页面tabBar切换,现在贡献出代码,希望可以帮助到你们
  • 微信小程序----返回上一页刷新或当前页刷新

    万次阅读 多人点赞 2018-04-05 19:11:49
    HTML实现当前页面刷新 首先我们都知道在HTML页面我们要实现当前页面刷新一般会怎么解决呢? 1,reload()方法刷新当前页面... 1,在实现效果之前,需要知道微信小程序页面生命周期,不是很清楚的可以看微信小程序
  • 主要介绍了微信小程序 实现注册登录功能(表单校验、错误提示),本文通过代码给大家详细介绍,需要的朋友可以参考下
  • 微信小程序的支付代码
  • 微信小程序开发 - 用户授权登陆

    万次阅读 多人点赞 2018-05-21 15:32:24
    本篇将帮助读者实现基于 微信开发者工具 &amp; C#环境 下的用户在小程序上的授权登陆。 准备: 微信开发者工具下载地址:...微信小程序开发文档:https://developers.weixin.qq.com/miniprogram/d...
  • 微信小程序-登录-页面-代码-实现-峯-推荐

    千次阅读 多人点赞 2021-03-19 11:01:52
    微信小程序-登录-页面-代码-实现-峯-推荐学习目标实现效果login.jslogin.wxmllogin.jsonlogin.wxss 实现效果 希望:2021新的一年,想要的都拥有,得不到的都释怀! login.js // pages/login/l.
  • 如何学习微信小程序? 学习微信小程序所需基础

    万次阅读 多人点赞 2020-03-30 16:23:19
    微信小程序作为近几年“微服务”的杰出代表,应用十分广泛。小程序是一种新的开放能力,开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播,同时具有出色的使用体验。 说的通俗一些,微信小...
  • 微信小程序商店微信小程序商店
  • 微信小程序授权登录代码

    千次阅读 2020-02-10 22:16:13
    由于微信官方修改了 getUserInfo 接口,所以现在无法实现一进入微信小程序就弹出授权窗口,只能通过 button 去触发。官方连接:...
  • 微信小程序注册页面

    千次阅读 2018-05-23 18:25:33
    一:微信小程序注册按钮首页代码:&lt;!--pages/face/face.wxml--&gt;&lt;view class="page"&gt; &lt;view class="page__hd"&gt; &lt;view class="page__...
  • 本篇文章主要介绍了微信小程序页面拦截器的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 73,831
精华内容 29,532
关键字:

微信小程序登录注册页面代码

微信小程序 订阅