- 博客(66)
- 收藏
- 关注
RSS订阅
原创 用axios渲染数据
css样式按照自己的要求写就好。需要用接口的话 先测试接口 再解决跨域问题 再检查自己是否安装、引用axios 正常获取数据 然后console.log(打印获取到的数据 【主要是检查是否能获取到数据】) 最后使用就行。
2022-10-09 11:08:15
1391
原创 vue路由跳转和传参
这里对文章进行总结：路由有两种跳转方式 声明式导航 和 编程式导航路由有两种传参方式 query传参或params传参。
2022-09-26 20:16:09
684
1
原创 关于React入门基础从哪学起？
英文官网中文官网自己整理的react文档，结合官网和所学知识的一个总结希望对各位有用。话不多说看下文：在表层上，模板的语法不同，React是通过JSX渲染模板。. 而Vue是通过一种拓展的HTML语法进行渲染，但其实这只是表面现象，毕竟React并不必须依赖JSX。. 在深层上，模板的原理不同，这才是他们的本质区别：React是在组件JS代码中，通过原生JS实现模板中的常见语法，比如插值，条件，循环等，都是通过JS语法实现的，更加纯粹更加原生。. 而Vue是在和组件JS代码分离的单独的模板中，通过指令来实
2023-03-27 20:31:59
544
2
原创 理解依赖注入（DI – Dependency Injection）
依赖注入(Dependency Injection, DI)是一种设计模式，也是Spring框架的核心概念之一。其作用是去除Java类之间的依赖关系，实现松耦合，以便于开发测试。为了更好地理解DI，先了解DI要解决的问题。
2023-03-03 09:12:06
513
原创 Java中 Synchronized 的用法
这时创建了两个SyncThread的对象syncThread1和syncThread2，线程thread1执行的是syncThread1对象中的synchronized代码(run)，而线程thread2执行的是syncThread2对象中的synchronized代码(run)；其效果和【Demo5】是一样的，synchronized作用于一个类T时，是给这个类T加锁，T的所有对象用的是同一把锁。写法一修饰的是一个方法，写法二修饰的是一个代码块，但写法一与写法二是等价的，都是锁定了整个方法时的内容。
2023-02-27 20:02:03
1264
原创 git的使用（终端输入指令）下
git的使用（终端输入指令）上我们接着上着来说 上章把 git 的 功能实现了一部分，本章我们接着上文 git 比较之后 再续下文这些就是git 的用法，以后会出更多的关于git 的用法 希望支持git的使用（终端输入指令） 上。
2023-02-26 20:30:30
496
1
原创 git的使用（终端输入指令） 上
今天带大家手把手敲一遍 git 流程：安装一下git（详细观看我之前发的git文档）git 文档之后我们先注册一下gitee账号。gitee 是创建远程仓库 的懒人注册就行…
2023-02-24 20:26:00
991
1
原创 关于vue3生命周期的使用、了解以及用途（详细版）
每一个Vue组件实例在创建时都需要经历一系列的初始化步骤，比如数据侦听，编译模板，挂载实例到DOM，以及在数据改变时更新DOM。在此过程中，它也会运行被称为生命周期钩子的函数，让开发者有机会在特定阶段运行自己的代码。最常用的是created、mounted、updated和unmounted。可以监听某一类型的改变而执行某项操作。跟vue2并没有太多不同之处Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是Vue的生命周期。
2023-02-22 17:49:11
10041
原创 git命令与认识
版本控制是指对软件开发过程中各种程序代码、说明文档等文件的变更进行管理，它将追踪文件变化，记录文件的变更时间、变更内容、甚至变更执行人进行记录，同时对每一个阶段性变更（不仅仅只是一个文件的变化）添加版本编号，方便将来进行查阅特定阶段的变更信息，甚至是回滚通过人工的复制行为来保存项目的不同阶段的内容，添加适当的一些描述文字加以区分繁琐、容易出错产生大量重复（冗余）数据。
2023-02-21 19:51:56
445
原创 Vue项目实战
新建common组件文件夹,新建对应的Header、Footer、Menu这些文件,然后完成Menu菜单,并且新建学生列表、作业列表、信息列表、考勤管理页面，并且配置路由，之后去写面包屑组件。添加 --legacy-peer-deps 指令在下载对应版本的指令后，保证各个依赖之间的不同版本的共存；然后在axios的二次封装的请求头里携带上token,至此,我们的axios二次封装和跨域完美解决。3、开需求分析会（甲方、SE、开发、测试）简单的进行首页、登录页、404页面的搭建。
2023-02-20 15:15:14
3102
1
原创 如何将vue2项目重构成vue3《后台管理系统》
首先我们要知道vue3是基于vue2基础上更改了一些改变但改变不大，基本上把vue2的后台管理系统复制过来对项目进行改写就行vue3格式怎么写就怎么改就行 组合式 选项式 灵活运用。
2023-02-16 16:07:35
4245
原创 vue2版本《后台管理模式》（下）
这章主写内容 该要的配置都有上章链接：《后台管理（中）》点击跳转路由在《后台管理（上）》，划分组件 每个组件某个功能以下都属于home子组件学生列表 StudentList信息列表 InfoList信息管理 InfoLists作业列表 WorkList作业管理 WorkMenu地图系列都是home的子组件数据概览 DataView二、header 头部 组件二、Menu 页面地图概览 MapView分数地图 ScoreMap旅游地图 TravelMap三、Bread 面包屑
2023-02-16 11:34:23
1490
2
原创 vue2版本《后台管理模式》（中）
登录页需要先设token值 看看token 是否存在 如果存在则跳转页面 不存在留着继续输入。还需要输入框的正则方式 格式不对无法提交账号信息 接下来就是需要登录接口了。看着挺多的但是你仔细捋一下思路 都是有规律的 好比上学 需要语文课本 就需要领语文课本，而语文课本是有编写者写的。你要是有足够时间你也可以自己配置一本语文书 然后想学就拿！！！回到代码上 登录页需要什么 你配置什么最后引入就行。
2023-02-16 10:55:34
773
2
原创 vue2版本《后台管理模式》（上）
本章主要讲项目的基本配置详解，没写登录之前先不要写主要内容 因为还要验证token值 如果格式正确 则会跳转到home。home页是主要内容然后用组件拼接成一个完整项目下章写 登录页面跳转 和封装api 设置token下节链接待补发 （主要是不想加班^ 0 ^！！！！
2023-02-15 20:17:36
1334
3
原创 购物车案例【版本为vue3】
首先我们要明白整个购物车的组成。它是由一个主页面加两个组件组合成的。等待几秒之后 输入你要创建的文件名进入下一步。打开app.vue 也就是。如果需要发布生产环境。
2023-02-13 17:27:40
1331
原创 toref() 函数和toRefs() 函数
● toRefs 用于将响应式对象转换为普通对象，但是其中的每个属性都会指向原始对象相应属性的ref（也就是依然保持响应式）。● toRef 用于为源响应式对象上的属性新建一个ref，从而保持对其源对象属性的响应式连接。例如使用父组件传递的props数据时，要引用props的某个属性且要保持响应式连接时就很有用。● toRefs后的ref数据不是原始数据的拷贝，而是引用，改变结果数据的值也会同时改变原始数据。● toRef后的ref数据不是原始数据的拷贝，而是引用，改变结果数据的值也会同时改变原始数据。
2023-02-11 05:00:00
653
原创 ref() 函数
参数可以传递任意数据类型，传递对象类型时也能保持深度响应式，所以适用性更广，setup中定义数据时推荐优先使用ref，方便逻辑拆分和业务解耦。template中使用ref值不用通过value获取（导出后已默认做了一个解构），js中使用ref必须通过.value获取。可以理解为ref是通过reactive包装了一层具有value属性的对象实现的。使用ref()方法我们可以创建任何类型的响应式数据，获取时需要通过.value来进行获取。ref 接受一个内部值并返回一个响应式可变的ref对象。
2023-02-11 01:00:00
3073
原创 reactive() 函数
reactive()函数只对对象类型有效（对象、数组、Map、Set），对string、number和 boolean这样的原始类型无效。● 普通对象==>返回一个proxy对象，响应式转换是深层的，对影响对象内部所有嵌套的属性。reactive接收一个普通对象然后返回该普通对象的响应式代理。● 用user.name=“new name”来修改值。● 获取数据值的时候直接获取，不需要加.value。● 内部基于proxy实现。● 参数只能传入对象类型。
2023-02-11 00:15:00
485
原创 什么是响应性？
这里单元格 A2 中的值是通过公式 = A0 + A1 来定义的 (你可以在 A2 上点击来查看或编辑该公式)，因此最终得到的值为 3，正如所料。这个术语在今天的各种编程讨论中经常出现，但人们说它的时候究竟是想表达什么意思呢？首先，为了能重新运行计算的代码来更新 A2，我们需要将其包装为一个函数。(dependency)，因为它们的值被用来执行这个作用。我们需要一个魔法函数，能够在 A0 或 A1 (这两个。(effect)，因为它会更改程序里的状态。当我们更改 A0 后，A2 不会自动更新。
2023-02-10 20:00:44
1149
1
原创 vue3状态管理模式 Pinia
多个组件，多个模块之间共享状态是最常见的开发述求，场景之多不胜枚举，例如全局用户状态，修改用户信息全局响应变化等等。
2023-02-08 17:47:00
1207
1
原创 用echarts实现柱状图
大家都知道，一般情况下，想要使用前端设置一个 柱状图 需要使用 canvas 画布进行编写，不仅代码多，逻辑处理麻烦，今天交大家使用一个插件，使用它就可以轻松的做出各种图。今天先和大家说一下如何引入 Echarts 插件，和柱状图需要如何使用，代码如何进行编写echars是一棵树这个图标是简单还是复杂，取决你在这棵树上绘制的枝干有多少树就是dom容器，初始化，挂载到dom容器上，把枝干在配置进来枝干可以在示例中，具体代码里有配置，在文档中查看具体效果引入 Echarts 插件（在vue中一般
2022-12-06 15:42:16
1606
1
原创 使用 echarts实现中国地图
效果图：实现思路首先打开自己的 package.json 看看 自己配置里面有:如果没有的话 手动输入 然后 npm i 或者cnpm i 一键安装安装完成后需要到 main.js 里配置以下内容：还需要一个data.json 文件 里面配置中国地图的数据我一般在 assets 文件下面创建一个data.json 里面把以下地图数据复制进去（因为数据太多 需要 ctrl+a 把下面代码全复制进去）：做完之后 基本的配置就已经完成了下面来实现效果：创建一个vue 的文件：需要先创建一个di
2022-12-06 09:59:18
1302
2
原创 说说你对slot的理解？
首先，大概了解一下插槽：间关联程度的度量，可以用"联系"作同义词，"独立性"作反义词。耦合度分类(由高到低)(1)内容耦合。当一个模块直接修改或操作另一个模块的数据,或者直接转入另一个模块时，就发生了内容耦合。此时，被修改的模块完全依赖于修改它的模块。类与类之间直接调用或继承关系都是属于这种耦合。需完全避免内容耦合，重点在于不要在类内部直接操作另一个类的对象的数据成员，可以通过在操作类中增加一个函数接口向客户类提供服务来实现(2)公共耦合。两个及两个以上的模块共同引用一个全局数据项就称为公共耦合。(
2022-11-20 20:14:22
1597
原创 函数式组件和类组件的区别
函数式组件和类组件的区别 1. 语法上的区别： 函数式组件是一个纯函数，它是需要接受props参数并且返回一个React元素就可以了。类组件是需要继承React.Component，而且class组件需要创建render并且返回React元素， 语法上来讲更复杂。2. 调用方式函数式组件可以直接调用，返回一个新的React元素；类组件在调用时是需要创建一个实例的，然后通过调用实例里的render方法来返回一个React元素。3. 状态管理(state)
2022-11-13 05:00:00
762
原创 什么是有状态组件？什么是无状态组件？
因为在 React 里最重(花时间最长)的一块就是 reconction(简单的可以理解为 diff)，如果不 render，就不会 reconction。注：函数式组件没有继承React.Component组件，没有state属性，没有自己的状态 (使用HOOK可以给函数式组件添加状态)注：类组件继承React.Component组件，会从父类中继承一个state属性，通过这个属性可以定义自己的状态。● 它是为了创建纯展示组件，这种组件只负责根据传入的props来展示，不涉及到state状态的操作。
2022-11-12 05:00:00
526
原创 React 组件生命周期
React 组件生命周期 组件的生命周期可分成三个状态： Mounting：已载入真实 DOM Updating：正在被重新渲染 Unmounting：已移出真实 DOM。
2022-11-11 05:00:00
66
原创 react组件
1、首先找到组件对应的类，并new了这个类的一个实例 2、通过实例找到原型上的render函数，让render执行 3、ReactDOM.render接收到原型上render函数retrun的虚拟的dom 4、将虚拟dom转换成真实dom，插入到页面中。
2022-11-10 05:00:00
209
原创 reject脚手架
npm install -g create-react-app全局安装 create-react-app --version查看版本 create-react-app react-app 创建项目 npm uninstall -g create-react-app 卸载脚手架 npm start启动项目。
2022-11-09 05:00:00
77
《前端基础知识大全》-完整版
2022-12-07
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人