人力资源智能化管理项目(day01:基础架构拆解)

学习源码可以看我的个人前端学习笔记 (github.com):qdxzw/frontlearningNotes

觉得有帮助的同学,可以点心心支持一下哈

一、基础架构拆解

1.拉取模板代码

git clone GitHub - PanJiaChen/vue-admin-template: a vue2.0 minimal admin template 项目名

2.core-js版本处理

项目模版中的core-js的版本号有些滞后,需要将其版本号改为“3.25.5”(package.json里面18行) 再安装依赖(npm i)

3.启动查看 npm run dev

登录界面

首页

4.安装插件

ESLint & Vetur

提升开发效率

5.项目目录和文件介绍

main.js:

①new Vue({})实例化

路由

store(Vuex)

根组件

②全局注册ElementUI

根组件App.vue

layout布局组件

基础设置settings.js和导航守卫permission.js

settings.js导出网站基础配置,包括:网站标题、固定header、显示logo

permission.js(权限),主要负责路由导航守卫

Vuex结构

页面交互状态(折叠侧边栏-固定头部)使用全局状态Vuex

根据功能拆分成不同的模块(modules)进行状态管理

通过getters建立对于模块中属性的快捷访问

使用模板中的icon图标

模板icons图标实现思路

了解:require.context(路径,是否扫描子目录, 正则匹配) 可以引入某个目录下的内容

了解:svg-sprite-loader打包了所有svg到一个svg标签上,将svg名称作为symbol标签的id属性

了解:svg-icon使用iconClass属性引用了symbol的id

6.导入样式和资源并使用git管理

资源在第一天的代码里面

提交到远程仓库,这个命令中的 -u 是记住此时的远程地址和分支,下次直接写git push就可以推送

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/626696.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

git将一个远程分支的部分修改提交到另一个远程分支

将一个远程分支的部分修改提交到另一个远程分支 将一个远程分支的部分修改提交到另一个远程分支,可以使用 git cherry-pick 命令。这个命令可以选择特定的提交(commit)从一个分支应用到另一个分支。 切换到目标本地分支: 首先&am…

js删除cookie

要删除一个cookie,你可以使用JavaScript中的document.cookie属性。这个属性包含当前页面上所有的cookie。要删除一个cookie,你可以将其设置为已过期,如下所示: document.cookie "cookieName; expiresThu, 01 Jan 1970 00:0…

使用WAF防御网络上的隐蔽威胁之SQL注入攻击

SQL注入攻击是一种普遍存在且危害巨大的网络安全威胁,它允许攻击者通过执行恶意的SQL语句来操纵或破坏数据库。 这种攻击不仅能够读取敏感数据,还可能用于添加、修改或删除数据库中的记录。因此,了解SQL注入攻击的机制及其防御策略对于保护网…

6.3.1认识Camtasia4(1)

6.3.1认识Camtasia4 安装完Camtasia4(本书使用Camtasia4.0.1版本)后,单击【开始】|【程序】|【Camtasia Studio 4】|【Camtasia Studio】,启动Camtasia Studio,启动后界面如图6-3-1所示。 图6-3-1 Camtasia Studio界面 Camtasia Studio窗口中…

智能时代的语言巨人:ChatGPT 与文心一言哪个更强?

想象一下,如果 AI 语言助手成为了我们生活中的超级英雄,那么 ChatGPT 和文心一言将是怎样的角色?一个是擅长英文、思维敏捷、能够随机应变的全能战士;另一个则是精通中文、文化深厚、在本土语境中无往不利的智者。当这两位超级英雄…

打印的前后顺序

面试题经常会有 <script>console.log(1)setTimeout(function(){console.log(2)})console.log(3)let pnew Promise((resolve,reject) >{console.log(4)resloved(hhhhhh)})p.then(res >{console.log(res)console.log(5)},res >{console.log(7)})console.log(6)&l…

小程序用户头像昵称获取规则调整

在小程序内&#xff0c;开发者可以通过 wx.login 接口直接获取用户的 openId 与 unionId 信息&#xff0c;实现微信身份登录&#xff0c;支持开发者在多个小程序或其它应用间匿名关联同一用户。 同时&#xff0c;为了满足部分小程序业务中需要创建用户的昵称与头像的诉求&…

Git版本控制——分支

分支 几乎所有的版本控制系统都以某种形式支持分支。 使用分支意味着可以把工作从开发主线上分离开来进行重大的Bug修改、开发新的功能&#xff0c;以免影响开发主线。 查看本地分支 git branch创建本地分支 git branch 分支名切换分支(checkout) git checkout 分支名创建…

Python源码26:海龟画图turtle画向日葵

---------------turtle源码集合--------------- Python教程43&#xff1a;海龟画图turtle画小樱魔法阵 Python教程42&#xff1a;海龟画图turtle画海绵宝宝 Python教程41&#xff1a;海龟画图turtle画蜡笔小新 Python教程40&#xff1a;使用turtle画一只杰瑞 Python教程39…

Pandas实战100例 | 案例 53: 处理缺失值

案例 53: 处理缺失值 知识点讲解 在数据分析中&#xff0c;处理缺失值是一个常见且重要的步骤。Pandas 提供了多种方法来处理 DataFrame 中的缺失值&#xff0c;包括填充缺失值和删除含有缺失值的行或列。 填充缺失值: 使用 fillna 方法可以将缺失值替换为指定的值。删除缺失…

萌宠宠物用品商城设计与制作-计算机毕业设计源码79718

摘要 在社会快速发展的影响下&#xff0c;宠物商城继续发展&#xff0c;大大增加了宠物用品的数量、多样性、质量等等的要求&#xff0c;使宠物用品商城的管理和运营比过去十年更加困难。依照这一现实为基础&#xff0c;设计一个快捷而又方便的萌宠宠物用品商城是一项十分重要并…

通过旋转机械臂,将机械臂上相机拍摄图像的任意点移动至图像中心的方法

计算原理 角度计算 相机CCD大小固定&#xff0c;即相机成像平面大小固定&#xff0c;相机视场角(FOV)仅由相机焦距F决定&#xff1b; 因此&#xff0c;定焦相机的FOV大小固定&#xff0c;通过上图可以看出相机视场角的计算公式为&#xff1a; FOV 2*atan&#xff08;w/2f&…

热门好用的第三方api接口汇总

空号检测&#xff1a;通过手机号码查询其在网活跃度&#xff0c;返回包括空号、停机等状态。手机在网状态&#xff1a;支持传入三大运营商的号码&#xff0c;查询手机号在网状态&#xff0c;返回在网等多种状态。反欺诈&#xff08;羊毛盾&#xff09;&#xff1a;反机器欺诈&a…

四、任意文件读取漏洞

一、介绍 解释&#xff1a;任意文件读取漏洞就其本身来说就是&#xff0c;攻击者绕过网站防御者设置的防御&#xff0c;读取到了正常使用者不应该读取到的内容。网站开发者使用不同的语言&#xff0c;任意文件读取漏洞利用方式就不同。 二、不同开发语言的不同漏洞点 1.PHP …

编译与链接(C/C++)

在C/C中关于代码的运行需要经过.c文件到.exe文件&#xff0c;而其中走过这些步骤这需要对原始的.c文件进行编译与链接。对于编译与链接主要构成了翻译环境&#xff0c;经过翻译环境之后生成.exe文件&#xff0c;然后在通过运行环境输出对应的结果。本篇主要讲解编译与链接。 以…

ElasticSearch扫盲概念篇[ES系列] - 第500篇

历史文章&#xff08;文章累计500&#xff09; 《国内最全的Spring Boot系列之一》 《国内最全的Spring Boot系列之二》 《国内最全的Spring Boot系列之三》 《国内最全的Spring Boot系列之四》 《国内最全的Spring Boot系列之五》 《国内最全的Spring Boot系列之六》 E…

Hudi0.14.0最新编译(修订版)

1 编译环境 Java1.8maven3.9.3hadoop3.3.4hive3.1.3spark3.2.1flink1.16.0hudi0.14.02 hudi准备 2.1 源码 $ git clone https://github.com/apache/hudi.git $ cd hudi $ git checkout release-0.14.02.2 修改pom文件 2.2.1 新增repository加速依赖下载 <

KT148A语音芯片智能锁扩展语音地址以及如何支持大量小文件的打包

一、语音芯片应用于智能锁的需求 智能锁的语音播放需求中&#xff0c;有很多需要多国语言合并在一起的需求 其中语音文件数多&#xff0c;并且每个语音文件小的特点 如果使用OTP的语音芯片&#xff0c;就很麻烦&#xff0c;因为用户不可烧录&#xff0c;调试也很繁琐 同时大…

【严重】GitLab 账号接管漏洞

漏洞描述 GitLab 是由GitLab公司开发的、基于Git的集成软件开发平台。 GitLab CE/EE中支持用户通过辅助电子邮件地址重置密码&#xff0c;默认情况允许通过未经确认电子邮件重置密码。攻击者可以利用此漏洞将用户帐户密码重置电子邮件发送任意未经验证的电子邮件地址&#xff…

算法竞赛备赛进阶之数位DP训练

数位DP的思想就是对每一位进行DP&#xff0c;计算时记忆化每一位可以有的状态&#xff0c;其作用是减少运算时间&#xff0c;避免重复计算。 数位DP是一种计数用的DP&#xff0c;一般就是要统计一个区间[A,B]内满足一些条件数的个数。 以1e9甚至1e18、1e100的问题为例&#x…