用微信小程序语法写一个登录首页

╰半夏微凉° 2024-03-25 16:23 85阅读 0赞

微信小程序采用的是基于 JavaScript 的语法，下面是一个简单的登录首页的代码示例：

\`\`\` // pages/index/index.js Page(\{ data: \{ userName: '', password: '', isLogin: false \}, onLoad: function() \{ // 判断是否已经登录 if (wx.getStorageSync('userInfo')) \{ this.setData(\{ isLogin: true \}) \} \}, bindUserNameInput: function(e) \{ this.setData(\{ userName: e.detail.value \}) \}, bindPasswordInput: function(e) \{ this.setData(\{ password: e.detail.value \}) \}, login: function() \{ if (this.data.userName === '' || this.data.password === '') \{ wx.showToast(\{ title: '用户名或密码不能为空', icon: 'none' \}) \} else \{ wx.setStorageSync('userInfo', \{ userName: this.data.userName, password: this.data.password \}) this.setData(\{ isLogin: true \}) wx.showToast(\{ title: '登录成功', icon: 'success' \}) \} \} \})

// pages/index/index.wxml登录欢迎你，\{ \{userName\}\}

// pages/index/index.wxss .container \{ display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; \}

.form \{ display: flex; flex-direction: column; align-items: center; width: 80%; \}

.form-item \{ margin-bottom: 20rpx; \}

.form-input \{ height: 40rpx; padding

发表评论取消回复

表情：

评论列表（有 0 条评论，85人围观）

还没有评论，来说两句吧...

相关阅读

相关用微信小程序语法写一个登录首页

微信小程序采用的是基于 JavaScript 的语法，下面是一个简单的登录首页的代码示例： \`\`\` // pages/index/index.js Page(\{ da

╰半夏微凉°/ 2024年03月25日 16:23/ 0 赞/ 86 阅读

相关写一段微信小程序 :用微信登录的代码

微信小程序中用微信登录的代码如下： // 在需要使用微信登录的页面的js文件中引入微信小程序提供的wx.login接口 const { login } = r

柔光的暖阳◎/ 2023年09月25日 15:23/ 0 赞/ 74 阅读

相关微信小程序开发一个小型商城（二、首页设计）

[微信小程序开发一个小型商城（一、准备工作）单击前往][Link 1] 首先在pages/index/index这一层层目录当中就是对首页进行编辑的地方，先看一下预览图：

小鱼儿/ 2023年07月25日 08:45/ 0 赞/ 18 阅读

相关微信小程序登录与企业微信小程序登录

在微信（或企业微信）中登录小程序，可以分为两种：第一种是使用微信授权登录，第二种使用账号密码登录（如某些非开放的系统）；一、使用微信登录小程序微信中调用w

心已赠人/ 2023年06月13日 11:17/ 0 赞/ 34 阅读

相关微信小程序（五）首页架构

一般首页都采用tabBar的形式去展现，好在小程序帮我们实现了tabBar，很容易就可以实现。在app.json中增加： "tabBar": { "

一时失言乱红尘/ 2023年02月25日 12:22/ 0 赞/ 30 阅读

相关用微信小程序写一个微信（布局练习）

文章目录页面展示项目链接项目设计 app.json index（发现页面） wallet（钱包页面）

梦里梦外;/ 2023年01月15日 15:22/ 0 赞/ 170 阅读

相关微信小程序实现“鲜肉APP”首页效果

> 项目地址[ ][Link 1][http://git.oschina.net/djcx/WeiXinXiaoChengXu/tree/master][http_git.os

╰半橙微兮°/ 2022年06月11日 06:27/ 0 赞/ 308 阅读

相关微信小程序微信登录

![image.png][] 开发接口登录 wx.login wx.checkSession 签名加密小程序登录小程序可以通过微信官方提供的登录能

Dear 丶/ 2021年09月29日 13:12/ 0 赞/ 692 阅读

相关微信小程序——小程序UI框架首页

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

迈不过友情╰/ 2021年07月26日 00:50/ 0 赞/ 632 阅读

相关微信小程序——商城首页页面

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

布满荆棘的人生/ 2021年07月25日 23:04/ 0 赞/ 582 阅读