- 博客(90)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 Vue3父子组件值传递(一)
Vue3父子组件值传递(一)本节我们来学习Vue3父子组件之间的数据传递 - 单向数据传递，这一节包括： 父组件传递数据到子组件 子组件传递数据到父组件 父子组件相互之间的数据单向传递 本节内容的前提是在父子组件传递数据的过程中，没有对传递的数据进行修改。1.父组件传递数据到子组件父组件传递数据到子组件的过程如下：也就是说，父组件需要将值传递给子组件的属性即可实现。子组件写法：<template> <div>..
2022-04-08 23:04:32
10012
原创 Vue3 PC端页面开发规范
Vue3 PC端页面开发规范1.开发环境Vue开发环境：软件 版本 node.js v16.14.0 vue @vue/cli 5.0.1 UI 框架：UI框架 版本 Element Plus ^2.0.5 PrimeVue ^3.12.1 其他组件：其他组件 版本 axios ^0.26.1 moment ^2.29.1 sweetalert ^2.1.2 以上列出的是开发所需要的重要部
2022-04-07 22:43:14
2528
原创 Vue3 PrimeVue 应用开发实战1
Vue3 PrimeVue 应用开发实战11.PrimeVue简介PrimeVue 是一套非常优秀的 Vue UI 组件库，支持 Vue 3 的 web UI 组件库，组件丰富，定制性很强，官网文档清晰，代码例子充足，而且中文化也做得很不错，是一款可用性很强的 Vue 组件库。PrimeVue 的技术特性： 组件丰富。内置 70 多个常用的组件，体验优秀，使用简单 主题丰富。内置大量主题，且提供强大的主题定制工具 高效开发模板。由专业设计师设计并由 Vue.
2022-04-04 22:54:21
6838
4
原创 Vue3子组件向父组件返回数据
Vue3子组件向父组件返回数据Vue3的子组件向父组件返回数据与Vue2有所不同。具体表现在emits，setup()的使用上，但原理上仍然是相同的，也就是说子组件在向父组件返回数据时，父组件在定义子组件时绑定事件，子组件在返回数据时触发相应的事件就可以了。1.子组件写法<template> <div> ...... <el-button @click="按钮单击事件">Default</el-button> &l...
2022-04-03 22:21:47
2428
原创 【6.面向对象编程】3.继承
3.继承所有面向对象的编程语言都允许用户从现有的一个类出发来定义一个新的类。这项技术就叫做继承。继承是面向对象语言最重要的特性之一。继承最突出的特点就是代码的可重用性。继承是指把一个新的类定义为已经存在的类的后代。新类继承父类的大部分内容，也可以添加新的内容。父类的字段和方法存在于子类中，子类继承父类的属性、字段、方法和事件。子类还可以添加新的成员。生活中的继承:在上面的图中，兔子和羊属于食草动物类，狮子和豹属于食肉动物类。食草动物和食肉动物又是属于动物类。在继承关系中，父类更.
2022-04-02 15:24:39
527
原创 Vue3前后端交互错误处理一致性
Vue3前后端交互错误处理一致性在Web开发中，前后端的交互中错误处理是不可避免的，比如：前端提交数据，后端需要校验，对于不符合要求的数据需要在前端进行提示。通常的做法是在后端返回固定格式的JSON数据来处理，但由于返回的JSON格式在业务、团队等方面很难维护其规范性，所以借助错误处理的方式，在数据请求中统一封装，这样有助于程序员将精力集中到业务处理中。1.环境开发环境 前端 Vue3 后端 Python FastAPI 2.后端处理规范 后端在
2022-04-01 23:06:42
434
原创 Post请求Loading及封装
Post请求Loading及封装1.组件 axios sweetalert 2.目标对post请求进行封装的目标及最终实现如下： 实现在请求时弹出遮罩层 在header中设置Authorization 发生错误弹出错误提示信息 鉴权失败后跳转到登录页面 3.loading代码使用 JS 代码实现在页面上显示遮罩层及图片，代码如下：/* * GUID */function guid () { function S4 () .
2022-03-31 23:52:52
166
原创 Vue3 Element Plus 应用开发实战2
Vue3 Element Plus 应用开发实战2本节实战内容：对 Element Plus 的菜单组件进行封装，实现一个无限级菜单组件。首先，我们来分析一下 Element Plus 中菜单的基本使用方法。1.Element Plus 菜单组件 <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo...
2022-03-30 21:59:56
1264
原创 Vue3子组件向父组件返回数据
Vue3子组件向父组件返回数据Vue3的子组件向父组件返回数据与Vue2有所不同。具体表现在emits，setup()的使用上，但原理上仍然是相同的，也就是说子组件在向父组件返回数据时，父组件在定义子组件时绑定事件，子组件在返回数据时触发相应的事件就可以了。1.子组件写法<template> <div> ...... <el-button @click="按钮单击事件">Default</el-button> &l...
2022-03-29 21:54:53
1317
原创 【6.面向对象编程】2.封装
2.封装通过上一节类与对象的基本概念我们了解到，对象是类的实例，是计算机系统内存中动态分配的一块内存空间，其结构由类定义。在本节中，我们通过对对象进行进行封装，从而形成类。在Delphi中，对象使用构造函数创建，使用析构函数删除。对象封装时，还可以针对属性和方法进行访问控制。2.1构造函数在Delphi中，类的对象并不真正保存数据，它只是一个指针，指向类数据在内存中的实际地址。所以在定义类对象时并没有真正地创建对象，而只是一个指针。要创建类的对象，可以调用其类的Create方法，该方法为对象分配
2022-03-28 09:13:14
236
原创 Vue3 Element Plus 动态图标
Vue3 Element Plus 动态图标Element Plus 中的图标以组件的形式来使用，而在基于Vue 2.x的Element UI中图标是字符串的形式，这样就导致过去的一些使用习惯不得不在使用Vue3的过程中改变，但实际上，在基于Vue3的Element Plus中也可以以字符串的形式来使用，只是需要多做一些工作。为什么基于字符串更适合大家的使用呢？因为图标的使用有时候是动态的，比如：菜单上的图标大部分的时候是通过后台配置的，按钮上面的图标可能会因为使用者的不同而显示不同的图标，所以我们
2022-03-27 22:42:13
9566
6
原创 Vue3 Element Plus 应用开发实战
Vue3 Element Plus 应用开发实战11.安装 Element Plusnpm install element-plus --save2.自动导入npm install -D unplugin-vue-components unplugin-auto-import配置 vue.config.js：const AutoImport = require('unplugin-auto-import/webpack')const Components = require(
2022-03-26 21:43:59
1999
原创 vue-devtools的安装
vue-devtools的安装vue-devtools是基于google chrome浏览器的一款调试vue.js应用的开发者浏览器扩展，可以在浏览器开发者工具下调试代码。前端开发工程师应该比较熟悉这款工具，可以边侧边栏窗格中的页面，边检查代码。由于vue是数据驱动的，所以就会存在在开发调试中查看DOM结构并不能看到我们想看到的内容，那么借助vue-devtools插件，我们就可以很容易的对数据结构进行解析和调试。本文重点介绍vue-devtools安装方法，提供chrome插件直接安装方法。接下来
2022-03-25 22:36:37
9579
3
原创 Vite-Vue3构建工具
Vite-Vue3构建工具Vite是Vue3.0新增的构建工具，目前仅支持Vue3.0。1.创建项目npm init vite-app myvitedemocd myvitedemonpm installnpm run dev执行过程如下：D:\>npm init vite-app myvitedemoNeed to install the following packages: create-vite-appOk to proceed? (y)npm WARN
2022-03-24 22:09:15
1348
原创 Vue3多页面开发
Vue3多页面开发在Vue3中，多页面开发的配置比较简单，下面来看一下具体的操作步骤：1.使用vue创建单页面应用程序见《Vue3脚手架指南》文章2.在项目的根目录下创建vue.config.js文件，如果已经创建则忽略3.在src目录下新建module文件夹，用于存放多页面相关文件module文件夹下用来存放页面文件，一个页面需要有最少三个文件构成，.html、.js、.vue，所以要创建一个最终的页面，我们需要创建三个文件，在实际开发中，最好根据自己的习惯或者公司的.
2022-03-23 22:05:09
9871
3
原创 Vue3脚手架指南
Vue3脚手架指南在DOS命令行窗口下操作使用Vue3，必须安装node.js，执行如下命令，检查node环境：>node -vv16.14.01.安装cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org2.安装脚手架Vue的脚手架名称由vue-cli改成了@vue/cli，如果以及全局安装了旧版本的vue-cli（1.x或2.x），最好先卸载：>npm uninstall v
2022-03-22 22:10:37
9835
原创 Vue3前后端交互错误处理一致性
Vue3前后端交互错误处理一致性在Web开发中，前后端的交互中错误处理是不可避免的，比如：前端提交数据，后端需要校验，对于不符合要求的数据需要在前端进行提示。通常的做法是在后端返回固定格式的JSON数据来处理，但由于返回的JSON格式在业务、团队等方面很难维护其规范性，所以借助错误处理的方式，在数据请求中统一封装，这样有助于程序员将精力集中到业务处理中。1.环境开发环境 前端 Vue3 后端 Python FastAPI 2.后端处理规范 后端在
2022-03-21 22:04:18
629
原创 【QyDBLib】1.CRUD-Api
1.CRUP ApiCRUD API 是基于Python编写的一套数据库操作类库，目前只在PostgreSQL、CitusDB数据库环境下使用。目标：简化基于PostgreSQL、CitusDB数据库环境下的数据库表增删改查操作，软件开发人员只需要将Web传输的JSON数据处理好以后直接调用对应的方法即可完成开发工作，从而使软件开发任意能够从数据库操作的代码中解放出来，更加专注于业务逻辑的处理。1.1 环境变量在应用系统的settings.py文件中设置以下环境变量LOG_PATH =
2022-03-20 23:56:55
783
原创 Python RSA加密解密封装
Python RSA加密解密封装1.RSA简介RSA公开密钥密码体制是一种使用不同的加密密钥与解密密钥，“由已知加密密钥推导出解密密钥在计算上是不可行的”密码体制 。在公开密钥密码体制中，加密密钥（即公开密钥）PK是公开信息，而解密密钥（即秘密密钥）SK是需要保密的。加密算法E和解密算法D也都是公开的。虽然解密密钥SK是由公开密钥PK决定的，但却不能根据PK计算出SK 。正是基于这种理论，1978年出现了著名的RSA算法，它通常是先生成一对RSA密钥，其中之一是保密密钥，由用户保存；另一个为
2022-03-19 22:57:46
1212
原创 【6.面向对象编程】1.类与对象
1.类与对象从20世纪90年代开始，面向对象编程（Object Oriented Programming，OOP）成为编程语言最主要的特征。在Delphi中，在Pascal语言中添加了面向对象的特性，构成了面向对象的Pascal语言（Object Pascal）。1.1 OOP基本概念面向对象程序设计中的概念主要包括：对象、类、抽象、封装、继承、多态等。通过这些概念面向对象的思想得到了具体的体现。 本节主要介绍类与对象的概念。对象是OOP应用程序的一个重要的组成部件。在该部件中，封装了部分应
2022-03-18 14:42:46
504
原创 【5.高级数据类型】8.动态使用指针变量
8.动态使用指针变量8.1New与Disponse过程当指针变量声明后没有使用@运算符赋值时，此时的指针变量称为动态指针变量，动态指针变量在访问之前必须首先分配内存单元。Object Pascal 提供了标准过程来处理：New，用来为动态指针变量分配内存单元，并把该单元的地址赋值给指针变量，所分配的单元大小由指针所指向的类型决定。如果应用程序的堆栈已没有足够的空间，则触发EoutOfMemory异常。调用格式：New(<指针变量名>)如：var p: ^int
2022-03-16 11:49:45
1231
原创 【5.高级数据类型】7.指针
7.指针指针（Pointer）是一种比较特殊的数据类型，指针类型的变量称为指针变量。指针变量是用来存放其他变量内存地址的一种变量。7.1指针类型的定义定义指针类型的语法格式：type <指针类型名> = ^<基类型>其中，基类型可以为任意一种类型。如：type TPi = ^integer; TPr = ^Real; BytePtr = ^Byte; CityInfo = Record Name:
2022-03-15 16:27:08
851
原创 【5.高级数据类型】6.记录
6.记录记录类型（Record）可以将数据类型不同的数据集中在一起作为整体进行操作。类似于数据库中记录概念。6.1记录类型的定义记录类型的定义格式：type <记录类型名> = Record <域名表1>: <类型1>; <域名表2>: <类型2>; ... <域名表n>: <类型n>; end;说明： 域名表可以是多
2022-03-14 23:11:08
581
原创 【5.高级数据类型】5.动态数组
5.动态数组动态数组在定义和声明时只指定数组的类型，而不指定数组的大小，在程序运行时动态地开辟内存空间。5.1一维动态数组一维动态数组的定义格式：type <数组类型名> = array of <基类型>;变量声明方式与其他类型的变量一致。也可以直接声明动态数组类型的变量，格式：var <数组变量名>: array of <基类型>;动态数组在声明时没有给出下标类型，可以通过标准过程Setlength来设置。如：
2022-03-13 22:58:35
825
原创 【5.高级数据类型】4.静态数组
5.静态数组数组类型是具有相同类型的元素按一定的顺序组成的序列。数组中数据元素被顺序安排在内存中一段连续的区域，可以通过数组名来访问。在Object Pascal中数组分为静态数组和动态数组。静态数组在程序初始化时必须分配内存单元，明确数组的大小和元素的数据类型。而动态数组在定义和声明时只指定数组的类型，而不指定数组的大小，在程序运行时动态地开辟内存空间。本节我们介绍静态数组的使用。5.1一维数组的定义数组通常分为一维、二维和多维数组。一维数组的定义格式：type <
2022-03-12 21:46:28
977
原创 【5.高级数据类型】3.集合
3.集合Pascal语言是少数几种将集合作为内部数据类型的程序设计语言之一。集合与数学中的集合相似，是指具有相同性质的对象的全体。组成集合的每个对象称为集合的元素。集合的特性： 集合中的元素是互异的，也就是说相同的元素视为一个元素（互异性） 集合中的元素是无序的，即{1,2,3,4,5}和{5,4,3,2,1}是同一个集合（无序性） 集合中元素的个数不能超过256个 元素和集合的关系是“属于”或“不属于” 3.1集合类型的定义定义格式：type
2022-03-11 21:04:03
452
原创 【5.高级数据类型】2.子界
2.子界在Object Pascal中，对具有确定的数据类型（称为基类型），且其取值范围确定的数据称为子界类型。基类型必须为顺序类型。2.1子界类型的定义子界类型定义的语法格式：type <类型名称> = <常量1> .. <常量2>;说明： 常量1表示子界类型的下界，常量2表示子界类型的上界，上下界必须是相同的顺序类型，即应同时为整型、布尔型、字符型或同一枚举类型。 子界的上下界的类型就是子界的基类型。 子界的上界
2022-03-10 22:24:06
341
原创 【5.高级数据类型】1.枚举
1.枚举枚举类型使用一组有限的标识符来表示一组连续的整数常数，其值是有限的。1.1枚举类型的定义枚举类型的定义格式：type <类型名称> = (<标识符1>, <标识符2>, ..., <标识符n>);说明： type保留字用于定义高级数据类型 <类型名称>是定义的枚举类型的名称 <标识符>是枚举类型的数据元素，圆括号中是该数据类型所有的取值，也称为枚举常量 枚举常量.
2022-03-09 21:47:08
438
原创 【4.Delphi程序设计】5.变量作用域
5.变量作用域变量作用域是指变量可以被使用的范围。Delphi应用程序由许多单元组成，每个单元又由许多过程和函数组成。在过程或函数中，可以定义： 只能在本过程或函数中使用的常量和变量 对本单元中所有过程或函数都可见的，对其他单元不可见的变量和常量 在不同单元之间共享的变量和常量 5.1公有变量和私有变量Delphi单元的结构：unit 单元名 // 单元首部interface // 单元接口部分implementation...
2022-03-08 21:31:28
343
原创 【4.Delphi程序设计】4.参数传递
4.参数传递4.1形式参数与实际参数形式参数简称形参，是在过程或函数首部形参表中的变量名，用于接收数据的变量。实际参数简称实参，是在调用过程或函数时传递给过程或函数的常量、变量或表达式。在使用中，实参和形参的变量名不一定相同，但调用的顺序必须一致，在各个参数之间用逗号分隔。4.2参数的传递Delphi中，参数的传递方式有两种： 按值传递 按地址传递 在形参表中，使用Var或者Out的形参表示按地址传递；使用Const或没有任何保留字说明的形参将使用按值传递的方式。
2022-03-07 20:17:03
513
原创 【4.Delphi程序设计】3.程序嵌套
3.程序嵌套在Delphi中，在函数或过程的内部，还可以定义新的函数或过程，这样的过程或函数只能由定义他的那个函数或过程中使用，这样的程序结构程序程序嵌套，也称为内部程序。3.1嵌套层次在Delphi中，程序具有一定的层次结构。运行子程序内部定义新的子程序，也就是子程序的嵌套定义。子程序的嵌套要求外层子程序能够完全包含内层子程序，不能局部包含，不允许交叉。嵌套层次示意图：示例：procedure Out(S: String);var x, y: Intege.
2022-03-06 20:55:41
668
原创 【4.Delphi程序设计】2.函数
2.函数函数是有返回值的子程序。函数可以分为：标准函数和自定义函数。标准函数也称为内部函数，是系统内部已经定义好的函数，可以直接使用。本节重点介绍自定义函数。2.1自定义函数的定义自定义函数的语法格式：Function <函数名>[(<形参表>)]: 返回类型; [声明部分]Begin [<语句>]End;说明： 书写时注意返回类型前面的冒号和后面的分号 函数可以没有形参，但必须有返回值 与过程类似，
2022-03-05 20:19:12
1263
原创 【4.Delphi程序设计】1.过程
1.过程在 Delphi 中，运行结束后没有返回值的子程序称为过程，过程有三种类型： 标准过程 - 系统内部已经定义好的过程，在需要的时候直接调用即可。 事件过程 - 当对象接收到某个动作时常数一个事件，自动执行该对象事件的一段程序，这段程序就是一个事件过程。 自定义过程 - 被独立定义的过程称为自定义过程。 1.1自定义过程的声明一般情况下，自定义过程定义在单元的 implementation 部分中的 {$R *.dfm} 后面。其声明格式：procedure
2022-03-04 09:57:09
794
原创 【3.Delphi常用组件】10.菜单
10.菜单10.1 MainMenuMainMeun（主菜单）组件也称为菜单栏。10.1.1菜单编辑1.在窗体中添加一个MainMenu组件2.双击 MainMenu 组件或右击组件，选择 MenuDesigner，或者选择组件的 Items 属性，单击右侧的...按钮即可进入编辑菜单的模式，如下图：3.选中某个菜单项，在对象编辑器中，Catption属性输入菜单名称，输入内容可以为：&+字符 表示加速字符- 表示分割线4.通过右击菜单项可进行插入、.
2022-03-03 11:34:00
1436
原创 【3.Delphi常用组件】9.文件相关组件
9.文件相关组件在Delphi中，与文件相关的组件包括：选择驱动器、查看目录及文件列表等。9.1 FileListBox文件列表组件FileListBox的主要属性：属性 说明 Directory 设置当前目录 Drive 设置当前驱动器 ExtenderdSelect 为True时可多选，否则不可以 FileEdit 将文件列表链接到一个编辑组件，显示列表中当前选中的文件 FileName 列表中当前选中的文件名 FileType
2022-03-02 10:40:01
966
原创 【3.Delphi常用组件】8.对话框
8.对话框在Delphi中提供了一系列标准对话框。8.1 打开文件对话框OpenDialog组件OpenDialog用于打开一个已经存在的文件，当选择一个文件后，选择的文件通过OpenDialog的FileName属性。其主要属性如下：属性 说明 DefaultExt 设置默认的文件扩展名 Filter 设置可打开的文件类型 FilterIndex 设置默认的Filter值，索引从1开始 InitialDir 设置对话框打开的初始化路径 Op
2022-03-01 17:55:43
1460
原创 【3.Delphi常用组件】7.计时器
7.计时器计时器（Timer）可以在应用程序中以重复的时间间隔产生一个事件。是非可视化组件。主要属性如下：属性 说明 Enabled 该属性值为True时，开始工作，为False时，暂停工作 Interval 设置定时器触发的周期（单位：ms） 主要事件：事件 说明 OnTimer 该事件以Interval属性设置的频率被触发 示例：电子时钟，同时将滚动条的方块位置设置为当前时间的秒值，界面如下图：程序代码如下：proce.
2022-03-01 16:52:55
1365
原创 【3.Delphi常用组件】6.滚动条
6.滚动条一般情况下，滚动条是自动加入的。如果计划自己控制窗口的滚动，就可以使用滚动条（TScrollBar）组件。其主要属性如下：属性 说明 LargeChange 设置当用户单击滚动条时（非箭头部分）滚动的距离 Max 可滚动的最大值 Min 可滚动的最小值 PageSize 按下PgUp、PgDn键时滚动条的滚动距离 Position 设置或返回滚动条中方块的位置 SmallChange 单击滚动条两端的箭头滚动的距离 主要
2022-03-01 15:10:50
1492
原创 【3.Delphi常用组件】5.列表类组件
5.列表类组件5.1 ListBox列表框（ListBox）组件同时显示所有选项，其主要属性如下：属性 说明 Items 列表框的选项集合 ItemsIndex 选项的索引值 Stored 选项是否排序 Columns 列表框的列数 MultiSelect 是否可以多项选择 SelCount 被选中的项目的数量，只读属性 Selected 用来设置或返回是否被选中 IntegralHeight 控制是否自动调整
2022-03-01 14:32:26
741
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人