- 博客(98)
- 收藏
- 关注
RSS订阅原创 React笔记（八）Redux
为了方便使用，Redux 的作者封装了一个 React 专用的库，本文主要介绍它。React-Redux 将所有组件分成两大类：UI 组件（presentational component）和容器组件（container component）。
2023-09-03 00:28:55
1467
原创 React笔记（七）Antd
在SysMenus.jsx中调用getAuthMenus接口来完成权限菜单数据的获取。在api/modules/users下编写获取权限菜单的接口。在components文件夹下创建函数Auth组件。注意：需要在request.js的响应拦截器中完成。在router/index.js的路由配置中使用。将后台的权限菜单数据转成antd格式的菜单数据。首先要使用antd，要先下载。
2023-09-03 00:23:09
1273
原创 React笔记（六）React路由
React 官方并没有提供对应的路由插件，因此，我们需要下载第三方的路由插件 —— React Router DOM。React Router 在 2021 年 11 月份的时候更新 v6 的版本。本次课就主要讲解V6版本。
2023-09-03 00:20:22
2446
原创 React笔记（五）hook
react16.8以后的新特性Hooks函数组件在react16.8以前函数组件只能被动接收外部数据，并且没有自己的生命周期钩子函数，函数内部也没有this可用新特性Hookhook推出的动机主要是因为类组件有一下几个不足组件之间复用公共逻辑比较麻烦，以前常见的提取组件公共逻辑的方式有高阶组件/renderProps等，但这些方式或多或少都对原有组件的代码组织方式有一定的破坏性复杂组件变得难以理解（例如相同的逻辑可能要写在不同的生命周期钩子函数里面）
2023-09-03 00:15:28
1402
原创 React笔记（四）类组件(2)
在 HTML 中，表单元素（如<input><textarea>和<select>）之类的表单元素通常自己维护 state，并根据用户输入进行更新。而在 React 中，可变状态（mutable state）通常保存在组件的 state 属性中，并且只能通过使用 setState()来更新。我们可以把两者结合起来，使 React 的 state 成为“唯一数据源”。渲染表单的 React 组件还控制着用户输入过程中表单发生的操作。被 React 以这种方式控制取值的表单输入元素就叫做“受控组件”。
2023-09-03 00:08:12
892
原创 React笔记（三）类组件(1)
类组件：类组件是指使用ES6中class定义的组件称为类组件回顾类的定义class 类名{类是由属性和方法组成类中的属性：表示的事物的特征类中方法：表示的是对象的行为class 类名{属性名1;属性名2;方法名1(){方法名2(){案例1：类的定义/*定义一个学生类class 类名{类名的规定1、类名是由字母、数字、下划线或者$符号组成2、名称不能以数字开头3、类名之间不能由空格、不能是关键字或者保留字4、不能是true,false,null。
2023-09-02 23:57:58
1498
1
原创 React笔记（二）JSX
在 React 中，每个 DOM 对象都有一个对应的 Virtual DOM 对象，它是 DOM 对象的 JavaScript 对象表现形式，其实就是使用 JavaScript 对象来描述 DOM 对象信息，比如 DOM 对象的类型是什么，它身上有哪些属性，它拥有哪些子元素。下面是一个DOM对象</div>对应的虚拟DOM，如下props: {},type: "p",props: {虚拟DOM如何提升效率的精准找出发生变化的 DOM 对象，只更新发生变化的部分。
2023-08-28 00:40:55
1285
原创 React笔记（一）初识React
React用于构建用户界面的 JavaScript 库，它也是一个渐进式的用于构建用户界面的javascript框架Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 ， yarn 包管理器，和 npm 的作用一模一样。都是用来管理项目中目录中的所有依赖包 Yarn 是为了弥补 npm 的一些缺陷而出现的yarn的官方：Yarn 中文文档。
2023-08-28 00:37:07
1255
原创 初识umi
Umi，中文发音为「乌米」，是可扩展的企业级前端应用框架。Umi 以路由为基础的，同时支持配置式路由和约定式路由，保证路由的功能完备，并以此进行功能扩展。然后配以生命周期完善的插件体系，覆盖从源码到构建产物的每个生命周期，支持各种功能扩展和业务需求。Umi 是蚂蚁集团的底层前端框架，已直接或间接地服务了 10000+ 应用，包括 Java、Node、H5 无线、离线（Hybrid）应用、纯前端 assets 应用、CMS 应用、Electron 应用、Serverless 应用等。
2023-08-28 00:33:51
872
原创 redux-saga
迭代器从一个数据集合中按照一定的顺序，不断的取出数据的过程Iterator的作用为各种数据结构，提供一个统一的接口使得数据结构的成员能够按某种次序排列迭代强调是依次取出，不能确定取出的有多少，也不能保证把数据全部取完迭代和遍历的区别迭代强调的依次取出，不能确定可以取出的值有多少，也不能保证去吧数据全部取完遍历必须保证数据的长度，循环不断的全部取出，针对于数据量过大的情况下使用遍历需要时间过长。
2023-08-28 00:28:23
121
原创 react ts
在项目的根目录中创建craco的配置文件(craco.config.js)，并在配置中配置别名。在src/store/reducers目录下创建routeReducer.tsx。建立一个loadable.ts，放在src/utils/loadable.ts。在src下创建router目录，在该目录的index.tsx编写路由配置文件。首先在utils目录下创建type.ts文件，这个文件里主要编写接口。在views目录下的Login.tsx文件中编写登录的静态页面。修改packge.json中的脚本命令。
2023-08-28 00:24:49
1563
原创 接口和类.
class 类名 {类可以包含以下几种成员属性：属性是类里声明的变量方法：方法为对象要执行的操作构造方法:用来进行实例的初始化操作return y;
2023-08-28 00:20:16
87
原创 初识TypeScript
TypeScript，简称 TS。TypeScript 和 JavaScript 之间的关系，就像 SCSS 和 CSS 之间的关系，SCSS 是对 CSS 的语法进行了一些扩展，同样的，TS 也是对 JS 的语法进行了一些扩展。SCSS 的代码最终会转换成 CSS 代码运行，同理，TS 的代码最终也会转换成 JS 的代码运行。TS 是 JS 的超集，因为 TS 对 JS 做了扩展，TS 中有 JS 没有的新特性。let 变量名: 数据类型 = 初始值。
2023-08-28 00:16:00
112
原创 Uniapp笔记（八）初识微信小程序
微信小程序简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用 小程序是一种新的开放能力，开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播，同时具有出色的使用体验JSON是一种数据格式，在实际开发过程中，JSON总是以配置文件的形式出现，小程序项目中也不例外；通过不同的.json配置文件，可以对小程序项目进行不同级别的配置。小程序项目中的4种JSON配置文件，分别是。
2023-08-28 00:09:41
165
原创 Uniapp笔记（七）uniapp打包
登录dcloud账户，在manifest.json的基础配置选项中，点击重新获取uniapp应用标识APPID。登录dcloud账户，在manifest.json的基础配置选项中，点击重新获取uniapp应用标识APPID。在控制台中生成报表，报告中显示生成的文件在硬盘中的位置，拷贝后上传服务器后部署。选择Android设置选项，输入各项内容，然后点击打包。在manifest.json的Web配置选项的。输入网站标题和网站域名，点击发行。在菜单栏的发行栏目，点击。网站-PC或手机H5。
2023-08-27 23:51:39
1810
原创 Uniapp笔记（四）uniapp语法3
给shopcart.js模块中的mutations选项中添加修改s购物车数量的方法的方法。给shopcart.js模块中的mutations选项中添加修改购物车状态的方法。编写一个加入购物车的方法的mutations方法addToShopcart方法。函数，读取本地存储的购物车数据，对 shopcartList 数组进行初始化。在src下创建store文件夹，在store文件夹下创建index.js文件。在商品列表的项中绑定单击事件，并传递商品id值。中获取商品的 Id，并调用请求商品详情的方法。
2023-08-27 23:43:37
1337
原创 Uniapp笔记（三）uniapp语法2
生命周期(Life Cycle)是指一个对象从创建-->运行-->销毁的整个阶段，强调的是一个时间段我们可以把每个uniapp应用运行的过程，也概括为生命周期小程序的启动，表示生命周期的开发小程序的关闭，表示生命周期的结束生命周期函数：是由uniapp框架提供的内置函数，会伴随着生命周期，自动按次序执行。生命周期函数的作用：允许程序员在特定的时间点，执行某些特定的操作，例如：页面刚加载的时候，可以在onLoad生命周期函数中初始化页面的数据。
2023-08-27 23:37:28
1531
原创 Uniapp笔记（二）uniapp语法1
</script>.swiper {</style><template></view></view><script></script>.nav-list{.nav-item{</style>渲染楼层中的标题<template></view></view></view><script>
2023-08-27 23:32:40
1099
原创 Uniapp笔记（一）初识uniapp
微信小程序简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用 小程序是一种新的开放能力，开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播，同时具有出色的使用体验uni-app是一个使用 Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。即使不跨端，
2023-08-27 23:27:25
61
原创 Ant-design-vue
路由丢失的主要原因是因为执行顺序的问题，解决办法是将动态路由的添加移到main.ts中 ，删除掉router/index.ts中的动态路由添加，一定要注意动态路由的添加必须放在app.use(router)之前,app.use(pinia)之后。其中要注意，这里边不能使用路由懒加载，动态路由的组件地址全部获取，可以在utils文件夹下编写routedync.ts。在src/http下新建interceptor.js文件，将axios拦截器的代码编写在这里。给columns列表增加操作项。
2023-08-27 23:24:04
1125
原创 VUE3基础
实际上，pinia就是Vuex的升级版，官网也说过，为了尊重原作者，所以取名pinia，而没有取名Vuex，所以大家可以直接将pinia比作为Vue3的Vuex。pinia中只有state、getter、action，抛弃了Vuex中的Mutation，Vuex中mutation一直都不太受小伙伴们的待见，pinia直接抛弃它了，这无疑减少了我们工作量。默认情况下，pinia持久化的数据存储在sessionStorage中，如果要存储到localStorage中，设置如下。必须在main.ts引入后挂载。
2023-08-27 23:18:34
323
原创 VUE3基础
2020年09月18日，vue3.0正式发布，命名为One PieceVue3和Vue2对比和vue2.0相比，vue3.0的变化主要有以下几点组合API和选项式API，开发人员根据自己情况和习惯，可以选择不同写法，组合式更加接近与原生的写法性能提升：Vue3这个框架将Vue全部重构了。新的框架。底层采用TS来进行重构，性能提升能达到100%对TS的支持，Vue3底层默认采用TS进行开发。我们Vue开发过程中，一般也会默认结合TS来使用按需加载。
2023-08-27 23:12:58
390
原创 VUE笔记（十）Echarts
ECharts是一款基个基于 JavaScript 的开源可视化图表库ISQQW.COM x ECharts 文档（国内同步镜像） - 配置项echarts图表集。
2023-08-26 18:02:12
1046
原创 VUE笔记（九）vuex
父组件向子组件通讯：通过props实现子组件向父组件通讯：通过自定义事件($emit)方式来实现兄弟组件之间的通讯：事件总线（$eventBus）、订阅与发布方式来实现跨级组件的通讯：可以通过(provider和inject)方式来实现集中管理共享数据高效实现组件之间数据共享vuex中的数据都是响应式的，能够实施保持数据与页面的同步。
2023-08-26 17:57:44
761
原创 VUE笔记（八）项目实战
单页面应用程序中，所有组件的DOM结构，都是基于唯一的index.html页面进行呈现的。默认情况下，写在.vue组件中的样式会全局生效，因此很容易造成多个组件之间的样式冲突问题。在api/modules/users.js文件中编写获取用户信息的api方法。在api/modules/users.js文件中编写获取权限菜单的方法。在Home页面中，在created生命周期函数中调用获取权限菜单的方法。每个组件的样式，都会影响整个index.html页面中的DOM元素。需要在请求拦截器中为头信息中添加。
2023-08-26 17:48:36
461
原创 VUE笔记（七）项目登录
为了方便期间，建议大家将如下配置文件内容复制到plugins/element.js文件中。如果要使用哪个组件，大家需要在plugins/element.js中注册该组件。在views文件夹下创建Login.vue文件。在router/index.js文件中配置路由。注册常用的elementui组件。在App.vue中配置路由出口。要完成校验功能，要具体以下几点。将 form-Item 的。属性设置为需校验的字段名。
2023-08-26 17:45:02
582
原创 VUE笔记（六）vue路由
路由：路由其实就是一个key-value对应关系路由器：用于管理多个路由关系的设备被称为路由器当路由发生变化的时候，会触发的一些函数，我们这些函数中编写一定业务逻辑，这种函数称为路由守卫函数，也有人称为导航守卫按照类型将导航守卫分为三大类全局前置守卫：当所有路由被触发的时候，在进入指定组件之前所触发的守卫函数路由独享守卫：触发指定路由的路由的时候触发组件内守卫：当离开组件的时候，或者进入组件的时候触发的守卫函数。
2023-08-26 17:40:57
666
原创 VUE笔记（五）网络通信
Axios 中文文档 | Axios 中文网 | Axios 是一个基于 promise 的网络请求库，可以用于浏览器和 node.js概念：axios是一个基于Promise的网络请求库，可以用于浏览器和node.js特点：使用简单,包尺寸小且提供了易于扩展的接口axios封装了XMLHttpRequest对象支持Promise的API可以配置拦截器来实现请求的拦截和响应拦截自动转换JSON数据取消请求批量请求Fetch被称为下一代Ajax技术，内部采用Promise方式来处理数据。
2023-08-26 17:28:17
776
原创 VUE笔记（四）vue的组件
整个项目都是由组件组成可以让代码复用：相似结构代码可以做成一个组件，直接进行调用就可以使用，提高代码复用性可以让代码具有可维护性（只要改一处，整个引用的部分全部都变）注意点：组件和模块区别模块仅对逻辑进行复用组件针对与结构、逻辑、样式进行复用的UI控件所谓的生命周期是指该组件对象从开始创建到销毁回收的整个全过程。
2023-08-26 15:51:32
1026
原创 VUE笔记（三）vue的语法
vue中定义过滤器，主要用于文本格式化，具体可以完成如下功能日期的格式化货币格式化小数点精确度的截取大小写首字母转换等注意：vue2中过滤器，vue3中将过滤去掉了定义私有过滤器data(){},methods{},//filters:配置对象filters:{过滤器的名称(参数){如何调用过滤器使用过滤器的时候可以在两种情况下使用，第1种情况在插值表达式中使用；第2种在属性中使用在插值表达式中使用{{message|过滤器的2名称|过滤器2的名称}}
2023-08-26 15:39:25
1740
原创 VUE笔记（二）vue的指令
语法不同，v-if的切换频繁的时候不建议使用，因为它的创建和删除所带来性能开销较大,v-show是通过隐藏元素来实现显示或隐藏的，一般情况下，尽量建议大家使用v-show。使用v-model完成表单数据的收集，能够将表单控件和data的数据一一对应起来，如果数据变化后表单项中的内容，如果表单项内容改变了也会驱动data数据的变化。新旧虚拟DOMkey存在的情况下，：将key值相同的虚拟DOM进行比对，如果新的虚拟DOM和旧的一样，一样的部分直接复用旧的，如果内容不一样，则重新创建。
2023-08-26 15:30:12
538
原创 VUE笔记（一）初识vue
Vue.jsVue (读音 /vjuː/，类似于view) 是一套用于构建用户界面的渐进式框架。构建用户界面：之前在学习vue之前通过原生js对DOM操作进行构建用户界面的使用原生js构建用户界面的不足- 没有规范，统一性不强，不利于团结写作开发- 大量的DOM操作，开发效率很低- 没有性能优化声明式渲染+组件系统(vue的核心)+客户端路由+状态机+工具链等部分组成渐进式：你可以在自己的项目只使用vue的一部分内容，不需要全部使用，这个vue不强制。
2023-08-26 15:20:42
460
原创 学生管理系统-07打包与上线
在etc/nginx/default.d文件中将配置项上添加tryfiles属性，具体配置如下。打包之后，会在项目的根目录下产生一个叫dist的文件夹，这个就是打包之后的文件。vue的项目必须要进行打包，并部署在nginx服务器上的。这里我将dist的名称改为studentMgr。使用编辑软件将default.conf文件打开。在该文件中添加publicPath属性，值为。通过xshell等命令行工具进入到linux。查看nginx进程状态。在终端上执行如下命令。
2023-07-25 22:34:56
381
原创 学生管理系统-06Echarts
ECharts是一款基个基于 JavaScript 的开源可视化图表库ISQQW.COM x ECharts 文档（国内同步镜像） - 配置项echarts图表集。
2023-07-25 22:32:42
237
原创 学生管理系统-05封装选项卡
4、在二级路由对应的组件中添加beforeRouteEneter的选项，用来监听进入组件的组件的行为。在vue-router这个路由插件中，route表示的是路由对象，route的常见属性。3、由于选项卡列表在多个页面中操作，这个数据要在多个组件中使用，所有使用状态机来操作。5、在store.js中的mutations中定义addTabs方法，用来添加路由。页面组件：用来构建页面的组件，每个项目中页面组件不同，主要作用是用来渲染信息的。自定义组件：用于复用的，可以在该项目中使用，也可以在其他的项目使用。
2023-07-25 22:27:05
275
原创 学生管理系统-04VueX
父组件向子组件通讯：通过props实现子组件向父组件通讯：通过自定义事件($emit)方式来实现兄弟组件之间的通讯：事件总线（$eventBus）、订阅与发布方式来实现跨级组件的通讯：可以通过(provider和inject)方式来实现Vuex 是什么？| Vuex概念：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式库，它采用集中式存储管理应用的所有组件的状态。
2023-07-25 22:20:39
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人