首页 > 编程语言 >小白开发程序的一天

小白开发程序的一天

时间:2022-11-04 12:23:13浏览次数:36  
标签:单点 方式 登录 程序 小白 开发 参数 name

技术背景,前后端分离,前端 vue 后端 .Net Core

小白有一个需求,在他费尽千辛万苦之力,写了N行sql才完成的汇总数据报表中,根据表头和首列类别定位的单元格上添加点击事件。点击单元格后,跳转至汇总数据的详细列表。经其分析,详细列表本身带有高级筛选功能,筛选时,会在表格上方显示筛选条件。所以,小白决定点击单元格跳转到详细列表页的同时带上参数做为筛选条件。

因为,详细列表页面为某位大哥开发,已经具备了一定的代码和基础。所以充分了解其已编辑代码,在其基础上开发可以达到写最少的代码量,减少不必要的重复的目的。

小白首先写了一个测试的url,在url中带入了测试的参数数据。然后在页面用某位大哥的方式

$route.params.name

接收参数时,发现接收不到。小白对 vue 没有经过深刻的系统的学习,只是根据教程笼统的学习过,再经过各种项目的洗礼。虽然可以说对 vue 非常熟悉,但对于细节的技术点,还是没有把握。不过小白是一位爱学习的好孩子,经其努力补充上了此技术点。获取route参数的方式有下面两种:

$route.query.name
$route.params.name
//name 为参数名

其中query写入参数的方式为

{name: '路由名', query: {参数名:值}} 
或者 
{path:'路由地址', query: {参数名:值}}

 此种方式类似于http请求的GET方式。

其中params写入参数的方式为

{name: '路由名', params: { 参数名: 值 }} 
或者 
'/path/参数1/参数2'  此种方式需要在路由中的path指定 :参数名成,确认参数1、参数2的是ID还是Name

此种方式类似于http请求的POST方式

最后通过push的方式压入route即可

$route.push(obj)

解决完参数传递的方式之后,小白发现,由于高级筛选正常情况下是通过手动点击后,记录筛选条件到 tag,tag 绑定到表头的 dom 。

其中表头的组件又是引用到列表页面的,所以小白考虑在 created 中构造 tag,然后以属性的方式传递至表头组件。

这种方式虽然可以实现效果,但是在小白写完代码测试过程中,发现之前的开发大哥已经写过类型的功能,并且是在mounted中使用nextTick实现的。

经对比小白惭愧不已,发现自己不光有知识盲点,还对页面的加载过程不甚了解。

使用nextTick不光在页面的Dom元素加载完毕后可以异步的更新数据,还要比把构造 tag 放到 created 中优雅的多。

查看nextTick说明,更是觉得nextTick是专门为处理此任务而生

nexttick使用场景:有时需要根据数据动态的为页面某些dom元素添加事件,这就要求在dom元素渲染完毕时去设置
在使用某个第三方插件时 ,希望在vue生成的某些dom动态发生变化时重新应用该插件,也会用到该方法。

 解决完这两个问题,小白想起最近让写的一些简单的Go脚本程序。小白虽然白了点,但是技术面还是可以的,不光大学的专业就学过多种语言(只能是学过,学完就还给老师)。应大佬要求,了解了一些Go的知识后,使用Go写了一些简单的小程序。

但是在刚刚开始写一个以上文件时,小白遇上了,他觉着很多自学初学者都会遇到的问题,引用包!默认情况下Go的引用路径是Go的安装路径,具体路径可以看错误提示,会提示在某个路径下找不到所要的包。小白又经过一番努力,发现了go.mod,按官方介绍其就是一个Modules。使用方式很简单:

在项目的根目录下使用命令

go mod init modname 

此命令将引用目录指定到当前项目目录。
需要注意的是创建的每个包,都需要创建相同名称的文件夹,在文件夹内创建go文件。
引用时一般使用 modname/packname 即可。

小白记录完这些问题之后兴致很高,于是乎,小白将其半年前做单点登录时收藏的几篇文章又做了一个总结:

有关单点登录,小白已知的单点登录协议主要有 CAS OAuth OIDC

根据多种单点登录方式的协议可知,单点是一种协商后的登录方式,各方按照相关协议开发登录验证模块,并接入单点系统即可实现单点登录

对于前后端不分离系统,使用Session Cookie做单点登录

对于前后端分离系统,通常使用token localStorage的方式开发。

下面举个实际的例子,比如:

拿CAS来说,新接入系统首页加入登录验证,如果未登录,即跳转至单点登录系统,并以参数的方式带入回调地址。

在单点登录系统登录验证成功之后,形成票据,同样以参数的形式跳转至回调地址。

新接入系统获得票据(ticket)之后,将票据传递至后台。后台API调用单点登录系统接口验证ticket。

验证通过后,形成自身系统的登录验证token或者说Session,之后新接入系统即可访问自己系统的后台,每次访问都带有验证信息。

以上是小白同学,一天中所学的知识点,不欢迎批评,欢迎吹水

标签:单点,方式,登录,程序,小白,开发,参数,name
From: https://www.cnblogs.com/pocn/p/16857344.html

相关文章

  • uniapp微信小程序返回上一页并刷新数据
    根据要求:详情页返回列表页时,要刷新列表页的数据,操作如下@click="goBack"goBack{letpages=getCurrentPages();//当前页面letbeforePage=pages[pages.len......
  • 案例3:JAVA GUI 随机点名程序
    先开发一个姓名维护的界面,输入学生的姓名,每行录入一个学生姓名,点击保存的时候将学生的姓名保存到一个txt文件中。再开发一个点名的程序,从维护好的txt文件中,随机读取一个学......
  • 微信小程序-wxParse插件的使用转化HTML到小程序识别的插件
    优点:目前已知唯一可以转化HTML到小程序识别的插件缺点:转换一个HTML标签可能需要大量的微信小程序标签还有样式配置:第一步,下载https://github.com/icindy/wxParse第二步......
  • 从小白到架构师(4): Feed 流系统实战
    「从小白到架构师」系列努力以浅显易懂、图文并茂的方式向各位读者朋友介绍WEB服务端从单体架构到今天的大型分布式系统、微服务架构的演进历程。读了三篇万字长文之后各......
  • 应用程序主题研发有妙招!DevExtreme拥有多种预定义主题样式
    DevExtreme拥有高性能的HTML5/JavaScript小部件集合,使您可以利用现代Web开发堆栈(包括React,Angular,ASP.NETCore,jQuery,Knockout等)构建交互式的Web应用程序,该套件附带功能......
  • #打卡不停更#三方库移植之NAPI开发[4]异步调用:Callback&Promise
    三方库移植之NAPI开发系列文章《HelloOpenHarmonyNAPI》、《C/C++与JS的数据类型转换》其接口都是同步的。对IO、CPU密集型任务需要异步处理。NAPI支持异步模型,提供了Pro......
  • 使用WinRar制作程序安装包
    这次研究了下WinRar制作程序安装包,我使用的是5.21版本。选中要打包的文件,先压缩为RAR文件,然后双击打开文件输入目录时可以选择前两项,输入绝对路径时,则为第三项。......
  • 手把手教你搭建消防安全答题小程序-首页
    火灾事故重预防,无灾避难得安康。本月是“119”消防月,请大家注意用火用气用电安全,共同做好单位、家庭消防安全工作。接下来,就让我手把手教你搭建消防安全答题小程序吧。软......
  • 第三十六章 使用 CSP 进行基于标签的开发 - 使用尽可能少的#server和#call调用
    第三十六章使用CSP进行基于标签的开发-使用尽可能少的#server和#call调用#server和#call的工作原理是,让浏览器向页面发出HTTP请求,其中包含一个特殊的加密令牌,该令牌......
  • 联系开发者
    iTelevision支持iCloud同步,隔空播放,倍速播放,快进/快退,自定义视频源,管理和导出M3U文件等等,功能持续强化中。计划支持iOS、iPadOS、tvOS、macOS等多平台通用。Github项目地......