当前位置: 首页 > news >正文

家政服务小程序实战开发教程015-填充用户信息

我们上一篇讲解了立即预约功能,存在的问题是,每次都需要用户填写联系信息。在我们前述篇章中已经介绍了用户注册的功能,在立即预约的时候我们需要把已经填写的用户信息提取出来,显示到表单对应的字段中。本篇我们就讲解一下如何提取已经注册的用户信息。

1 变量的作用域

在首页开发的时候,其实已经新建了一个变量用来保存用户信息。但当时考虑的是只在首页使用,现在如果需要跨页面使用,就需要将变量的作用域改为全局。全局的意思就是所有页面都可以使用

在这里插入图片描述
修改了作用域后,其实是又新建了一个变量
在这里插入图片描述
修改了作用域之后在首页生命周期函数中,我们需要重新改一下代码。

export default {async onAppLaunch(launchOpts) {//console.log('---------> LifeCycle onAppLaunch', launchOpts)//$app.auth.currentUser.openId = "o29js5TnCwiYJayG9AieKzkIlOBg"const userInfo  = await $app.auth.getUserInfo();console.log(userInfo)const result = await app.cloud.callModel({name:'yhxx_5wybupo',methodName:'wedaGetRecords',params:{pageNo:1,pageSize:1,where:[{key:"openid",rel:"eq",val:userInfo.openId}]}})console.log(userInfo.openId)console.log(result)if(result.total>0){$app.dataset.state.user = result.records[0]app.navigateTo({pageId:"index",params:{}})}else{/*app.navigateTo({pageId:"u_jiao_se_xuan_ze",params:{}})*/}},onAppShow(appShowOpts) {//console.log('---------> LifeCycle onAppShow', appShowOpts)},onAppHide() {//console.log('---------> LifeCycle onAppHide')},onAppError(options) {//console.log('---------> LifeCycle onAppError', options)},onAppPageNotFound(options) {//console.log('---------> LifeCycle onAppPageNotFound', options)},onAppUnhandledRejection(options) {//console.log('---------> LifeCycle onAppUnhandledRejection', options)}
}

我们只是修改了变量的路径,全局变量是通过app对象来获取的

2 填充用户信息

代码修改后,程序一加载的时候就会加载用户信息,在新增预约的时候我们只需要将对应字段的输入值绑定到全局变量的具体字段就可以。

先绑定用户的联系地址

在这里插入图片描述
再绑定联系电话
在这里插入图片描述
接着绑定用户信息
在这里插入图片描述
用户信息字段需要隐藏,切换到样式,点击布局旁边的眼睛

在这里插入图片描述

3 跳转到预约成功页面

如果采用了表单容器,提交成功后会跳转到上一个页面,我们修改一下,跳转到预约成功页面。先新建一个预约成功页面
在这里插入图片描述
页面中添加普通容器,里边添加图标和文本组件
在这里插入图片描述
然后设置纵向排列居中对齐即可

4 设置表单容器提交事件

选中表单容器,删除返回上一页事件,新增页面跳转事件,跳转到我们预约成功页面

在这里插入图片描述

总结

我们本篇完善了立即预约功能,填充了用户信息,提交成功后跳转到预约成功页面。下一篇我们介绍一个辅助功能,文章列表及文章详情功能开发。

相关文章:

家政服务小程序实战开发教程015-填充用户信息

我们上一篇讲解了立即预约功能,存在的问题是,每次都需要用户填写联系信息。在我们前述篇章中已经介绍了用户注册的功能,在立即预约的时候我们需要把已经填写的用户信息提取出来,显示到表单对应的字段中。本篇我们就讲解一下如何提…...

python+selenium使用webdriver启动chrome出现闪退现象解决

这两天发现之前开发的爬虫程序出问题了:谷歌浏览器出现打开立即闪退的现象,代码未修改过,检查也没有任何问题! 查看chrome浏览器发现版本更新了 ↑(点击chrome浏览器右上角三个点,最下面帮助→Google Chr…...

新建idea项目

目录IDEA系列之创建各种项目 https://blog.csdn.net/LOVEQD123/article/details/105886077 idea 创建项目的三种方式 https://blog.csdn.net/weixin_50034122/article/details/118754521 创建空项目 https://blog.csdn.net/qq_44537956/article/details/123075134 创建 spri…...

Django框架之类视图

类视图 思考:一个视图,是否可以处理两种逻辑?比如get和post请求逻辑。 如何在一个视图中处理get和post请求 注册视图处理get和post请求 以函数的方式定义的视图称为函数视图,函数视图便于理解。但是遇到一个视图对应的路径提供…...

win11/10+Azure kinect DK配置 VS2019/2017/2015的方法(简单,亲测可以)

首先下载文件:文件的下载和安装方法参考我的博客(131条消息) WIN11/win10Azure Kinect DK详细驱动配置教程(亲测)_Vertira的博客-CSDN博客安装好VS2019,创建好控制台c工程。这些都很简单,不细说。配置:首先配置环境变量…...

子查询的相关例题

子查询的相关例题: 查询和Zlotkey相同部门的员工姓名和工资 SELECT e1.last_name,e1.first_name,e1.salary FROM employees e1 WHERE e1.department_id (SELECT e2.department_idFROM employees e2WHERE e2.last_nameZlotkey );查询工资比公司平均工资高的员工号…...

vue2.0与vue3.0及vue与react区别

vue2.0与3.0及vue与react区别vue2.0 与 vue3.0 区别1. 双向绑定原理2.Vue3支持碎片(Fragments)3.Composition API4.生命周期5.v-if和v-for的优先级6.typescript支持vue与 react区别共同点1.虚拟domdiff算法2.提供了响应式和组件化的视图组件。3.注意力集中保持在核心库&#xf…...

【SQL】MySQL秘籍

chihiro-notes 千寻简笔记 v0.1 内测版 📔 笔记介绍 大家好,千寻简笔记是一套全部开源的企业开发问题记录,毫无保留给个人及企业免费使用,我是作者星辰,笔记内容整理并发布,内容有误请指出,笔…...

vue-router 的基本用法

vue-router 的基本用法 1.什么是 vue-router vue-router 是 vue.js 官方给出的路由解决方案。它只能结合 vue 项目进行使用,能够轻松的管理 SPA 项目中组件的切换。 vue-router 的官方文档地址:https://router.vuejs.org/zh/ 2.vue-router 安装和配置的…...

图像显著性目标检测

一、概述 1、定义 图像显著性检测(Saliency Detection,SD), 指通过智能算法模拟人的视觉系统特点,预测人类的视觉凝视点和眼动,提取图像中的显著区域(即人类感兴趣的区域),可以广泛用于目标识别、图像编辑以及图像检索等领域&am…...

力扣-查找重复的电子邮箱

大家好,我是空空star,本篇带大家了解一道简单的力扣sql练习题。 文章目录前言一、题目:182. 查找重复的电子邮箱二、解题1.正确示范①提交SQL运行结果2.正确示范②提交SQL运行结果3.正确示范③提交SQL运行结果4.正确示范④提交SQL运行结果总结…...

如何选择正规可靠的ISO认证机构?

ISO认证其实早已融入我们生活中,因为日常生活很多产品都有认证标识,企业办理ISO体系就需要找第三方认证公司,市面上这种公司也有不少,但找到合适可靠、认真负责的还是不易,尤其是体系认证有年审,如何留住客…...

React源码解读之更新的创建

React 的鲜活生命起源于 ReactDOM.render ,这个过程会为它的一生储备好很多必需品,我们顺着这个线索,一探婴儿般 React 应用诞生之初的悦然。 更新创建的操作我们总结为以下两种场景 ReactDOM.rendersetStateforceUpdate ReactDom.render …...

【程序人生】从土木专员到网易测试工程师,薪资翻3倍,他经历了什么?

转行对于很多人来说,是一件艰难而又纠结的事情,或许缺乏勇气,或许缺乏魄力,或许内心深处不愿打破平衡。可对于我来说,转行是一件不可不为的事情,因为那意味着新的方向、新的希望。我是学工程管理的&#xf…...

C++——C++11第二篇

目录 可变参数模板 lambda表达式 lambda表达式语法 捕获列表说明 可变参数模板 可变参数:可以有0到n个参数,如之前学过的 Printf C11的新特性可变参数模板能够让您创建可以接受可变参数的函数模板和类模板 模板参数包 // Args是一个模板参数包&…...

14.最长公共前缀

编写一个函数来查找字符串数组中的最长公共前缀。如果不存在公共前缀,返回空字符串 ""。示例 1:输入:strs ["flower","flow","flight"]输出:"fl"示例 2:输入&…...

【免费教程】 SWMM在城市水环境治理中的应用及案例分析

SWMMSWMM(storm water management model,暴雨洪水管理模型)是一个动态的降水-径流模拟模型,主要用于模拟城市某一单一降水事件或长期的水量和水质模拟。EPA(Environmental Protection Agency,环境保护署&am…...

SortableJS/Sortable拖拽组件,使用详细(Sortablejs安装使用)

简述 作为一名前端开发人员,在工作中难免会遇到拖拽功能,分享一个github上一个不错的拖拽js库,能满足我们在项目开发中的需要,支持Vue和React,下面是SortableJS的使用详细; 这个是sortableJS中文官方文档&…...

Heartbeat+Nginx实验

HeartbeatNginx实验 Heartbeat是什么? Heartbeat是 Linux-HA 工程的一个组件,自1999 年开始到现在,发布了众多版本,是目前开源 Linux-HA项 目成功的一个例子,在行业内得到了广泛的应用 构建规划: 两台后…...

JavaEE|网络编程之套接字 TCP

文章目录一、ServerSocket API构造方法常用方法二、Socket API构造方法常用方法注意事项三、TCP中的长短连接E1:一发一收(短连接)E2:请求响应(短连接)E3:多线程下的TCP回响服务器说明:这部分说实话有点懵&a…...

反向工程与模型迁移:打造未来商品详情API的可持续创新体系

在电商行业蓬勃发展的当下,商品详情API作为连接电商平台与开发者、商家及用户的关键纽带,其重要性日益凸显。传统商品详情API主要聚焦于商品基本信息(如名称、价格、库存等)的获取与展示,已难以满足市场对个性化、智能…...

Leetcode 3577. Count the Number of Computer Unlocking Permutations

Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接:3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯,要想要能够将所有的电脑解锁&#x…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章?AI自动生成,效率提升10倍! 支持多语言、自动配图、定时发布,让内容创作更轻松! AI内容生成 → 不想每天写文章?AI一键生成高质量内容!多语言支持 → 跨境电商必备&am…...

代理篇12|深入理解 Vite中的Proxy接口代理配置

在前端开发中,常常会遇到 跨域请求接口 的情况。为了解决这个问题,Vite 和 Webpack 都提供了 proxy 代理功能,用于将本地开发请求转发到后端服务器。 什么是代理(proxy)? 代理是在开发过程中,前端项目通过开发服务器,将指定的请求“转发”到真实的后端服务器,从而绕…...

管理学院权限管理系统开发总结

文章目录 🎓 管理学院权限管理系统开发总结 - 现代化Web应用实践之路📝 项目概述🏗️ 技术架构设计后端技术栈前端技术栈 💡 核心功能特性1. 用户管理模块2. 权限管理系统3. 统计报表功能4. 用户体验优化 🗄️ 数据库设…...

基于SpringBoot在线拍卖系统的设计和实现

摘 要 随着社会的发展,社会的各行各业都在利用信息化时代的优势。计算机的优势和普及使得各种信息系统的开发成为必需。 在线拍卖系统,主要的模块包括管理员;首页、个人中心、用户管理、商品类型管理、拍卖商品管理、历史竞拍管理、竞拍订单…...

08. C#入门系列【类的基本概念】:开启编程世界的奇妙冒险

C#入门系列【类的基本概念】:开启编程世界的奇妙冒险 嘿,各位编程小白探险家!欢迎来到 C# 的奇幻大陆!今天咱们要深入探索这片大陆上至关重要的 “建筑”—— 类!别害怕,跟着我,保准让你轻松搞…...

【UE5 C++】通过文件对话框获取选择文件的路径

目录 效果 步骤 源码 效果 步骤 1. 在“xxx.Build.cs”中添加需要使用的模块 ,这里主要使用“DesktopPlatform”模块 2. 添加后闭UE编辑器,右键点击 .uproject 文件,选择 "Generate Visual Studio project files",重…...

阿里云Ubuntu 22.04 64位搭建Flask流程(亲测)

cd /home 进入home盘 安装虚拟环境: 1、安装virtualenv pip install virtualenv 2.创建新的虚拟环境: virtualenv myenv 3、激活虚拟环境(激活环境可以在当前环境下安装包) source myenv/bin/activate 此时,终端…...

CppCon 2015 学习:Reactive Stream Processing in Industrial IoT using DDS and Rx

“Reactive Stream Processing in Industrial IoT using DDS and Rx” 是指在工业物联网(IIoT)场景中,结合 DDS(Data Distribution Service) 和 Rx(Reactive Extensions) 技术,实现 …...