![](https://img-blog.csdnimg.cn/00784ec4cdfc46ad99c7fc766c323b10.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
React与Vue
文章平均质量分 86
React和Vue两大前端框架的基础知识
Sco_Jing1031
Succès ou échec dans celui-ci
展开
-
【React】合成事件和原生事件
本文主要讲述react合成事件和原生事件,包括事件流、DOM事件流的几个阶段、react合成事件的原理、在react中使用原生事件方法、合成事件和原生事件混合使用时的响应顺序以及如何阻止冒泡。原创 2022-04-04 21:30:00 · 3462 阅读 · 1 评论 -
【Vue】路由、Vue UI组件库
本文主要讲述了Vue路由的基本使用、多级路由、Vue的路由参数(query参数、params参数、路由的props配置)、路由导航、缓存路由组件、两个新的生命周期钩子、路由守卫、路由器的两种工作模式,以及Vue U UI组件库。原创 2022-02-03 19:00:00 · 184 阅读 · 2 评论 -
【Vue】Vuex概念和基本使用
本文主要讲了vuex的概念、vuex的流程、搭建vuex环境、vuex的基本使用、getters的使用、四个map方法的使用、模块化与命名空间原创 2022-01-27 21:17:49 · 143 阅读 · 1 评论 -
【Vue】插槽、vue脚手架配置代理
本文主要讲述了vue的插槽功能,主要分为默认插槽、具名插槽和作用域插槽,还有vue脚手架配置代理。原创 2022-01-11 19:58:43 · 137 阅读 · 1 评论 -
【Vue】TodoList案例---脚手架基础案例示意
本文主要简述了一个有关Vue脚手架的基础案例——TodoList案例。原创 2021-12-31 23:13:45 · 165 阅读 · 4 评论 -
【Vue】脚手架、ref、props、mixin混入、插件、scoped样式
本文主要讲述了Vue脚手架的基础概述,包括Vue脚手架的安装、脚手架文件(或模板项目)的结构、关于不同版本的Vue、vue.config.js配置文件,以及ref属性、props配置项、mixin(混合/混入)、插件、scoped样式原创 2021-12-29 09:19:45 · 391 阅读 · 2 评论 -
【Vue】组件基础(组件的嵌套、VueComponent)
本文主要讲述了Vue组件的基础,及初步了解组件化编程,主要包括有模块与组件、模块化与组件化、非单文件组件、组建的嵌套、VueComponent及一个重要的内置关系、单文件组件的组成和基本使用。原创 2021-12-26 14:40:38 · 2088 阅读 · 2 评论 -
【Vue】生命周期简述
本文讲述了Vue的声明周期简单概述,vue生命周期中主要包括8个声明周期钩子函数:创建阶段:beforeCreate、created、beforeMount、mounted运行阶段:beforeUpdate、updated、(activated、deactivated这两个可去掉)销毁阶段:beforeDestroy、destroyed。原创 2021-12-22 21:48:35 · 162 阅读 · 2 评论 -
【Vue】基础(下):条件渲染、列表渲染(key)、过滤器、内置和自定义指令
本文主要包括了vue的条件渲染(v-if和v-show)、列表渲染(基本列表、key的作用、数据监测、收集表单数据)、过滤器、内置指令、自定义指令等vue基础知识。原创 2021-12-20 20:36:55 · 653 阅读 · 2 评论 -
【Vue】基础(中):数据代理、事件处理、计算和监视属性、class与style绑定
有关Vue基础知识,数据代理、事件处理、计算属性、监视属性、class与style绑定等原创 2021-12-13 21:57:38 · 962 阅读 · 4 评论 -
【Vue】基础(上):MVVM、模板语法、数据绑定
Vue基础,包括Vue概述、MVVM架构模式、Vue初识、模板语法、数据绑定、el和data的两种写法。原创 2021-12-06 21:46:56 · 703 阅读 · 2 评论 -
【React】解决antd样式没有显示问题(网页频闪问题)
问题详情最近需要使用Ant Design UI库创建项目,已经创建了五、六次项目了,每次创建项目耗时久、删项目又麻烦不说,展示效果并没有显示antd的样式,整个网页出现不停频闪效果,示例如下:解决方法忘记在App.css文件最前方加入一句:@import "~antd/dist/antd.css";很难忘的两天,故记录一下,警示下次不会再犯...原创 2021-11-30 21:23:21 · 1535 阅读 · 3 评论 -
React -- redux详解
欢迎学习交流!!!持续更新中…文章目录redux理解学习文档工作流程redux的核心概念redux理解学习文档英文文档: https://redux.js.org/中文文档: http://www.redux.org.cn/Github: https://github.com/reactjs/redux是什么redux是一个专门用于做状态管理的JS库(不是react插件库)。它可以用在react, angular, vue等项目中, 但基本与react配合使用。作用: .原创 2021-11-28 20:25:41 · 5115 阅读 · 2 评论 -
React路由超详解...
欢迎学习交流!!!持续更新中…文章目录SPA路由react-router-dom普通组件与路由组件的区别路由的基本使用SPASPA是指单页面Web应用(single page web application,即SPA):整个浏览器应用只有一个完整的页面。同时点击页面中的链接不会刷新页面,只会做页面的局部更新。页面中的数据都需要通过ajax请求获取,并在前端异步展现。目前常使用“单页面-多组件”。路由什么是路由:一个路由就是一个映射关系(key:value)key为路径.原创 2021-11-22 21:32:26 · 739 阅读 · 2 评论 -
React -- BrowserRouter、HashRouter的区别
今天在学习React路由时遇到了有关使用HashRouter与BrowserRouter例子,查询了有关二者的区别,还有HistroyRouter,故想用一篇博客记录一下底层原理HashRouter使用的是URL的哈希值,利用监听hashchange事件来前进后退BrowserRouter使用的是H5的history API,不兼容IE9及以下版本。HistroyRouter 利用了 HTML5 History Interf原创 2021-11-07 20:25:41 · 330 阅读 · 2 评论 -
React -- PureComponent类和Component类的区别
欢迎交流学习!!!持续更新中…文章目录二者区别总体来说,他们区别不大,几乎完全相同,也可以理解为,Purecomponent是一个有条件的更具性能的Component。二者区别Component是React App的基本构建的单位,也是React中的基本代码复用单位。PureComponent与Component在除了其shouldComponentUpdate方法的实现之外几乎完全相同。PureComponent已经替我们实现了shouldComponentUpdate方法。对于Pur.原创 2021-10-30 20:15:00 · 106 阅读 · 1 评论 -
前端路由 与 后端路由
欢迎学习交流!!!持续更新中…文章目录前端路由后端路由二者比较前端路由的两种模式hashhistroy二者比较路由:路由是根据不同的 url 地址展示不同的内容或页面,是指分组从源到目的地时,决定端到端路径的网络范围的进程。路由工作包含两个基本的动作:1、确定最佳路径2、通过网络传输信息在路由的过程中,后者也称为后者也称为(数据)交换。交换相对来说比较简单,而选择路径很复杂。前端路由前端路由的核心是:改变URL,但是页面不进行整体的刷新。根据不同的hash地址,展示不同前端组件.原创 2021-10-26 20:21:44 · 2217 阅读 · 2 评论 -
React -- 脚手架配置代理
欢迎学习交流!!!持续更新中…文章目录前置说明常用的ajax请求库前置说明React本身只关注于界面, 并不包含发送ajax请求的代码前端应用需要通过ajax请求与后台进行交互(json数据)react应用中需要集成第三方ajax库(或自己封装)常用的ajax请求库jQuery: 比较重, 如果需要另外引入不建议使用axios: 轻量级, 建议使用封装XmlHttpRequest对象的ajaxpromise风格可以用在浏览器端和node服务器端...原创 2021-10-24 20:38:15 · 97 阅读 · 2 评论 -
React -- 脚手架简述
欢迎学习交流!!!持续更新中…文章目录创建项目并启动安装依赖react脚手架项目结构# React应用(基于React脚手架)## react脚手架1、xxx脚手架: 用来帮助程序员快速创建一个基于xxx库的模板项目包含了所有需要的配置(语法检查、jsx编译、devServer…)下载好了所有相关的依赖可以直接运行一个简单效果2、 react提供了一个用于创建react项目的脚手架库: create-react-app3、 项目的整体技术架构为: react + webp.原创 2021-10-22 22:10:41 · 578 阅读 · 2 评论 -
React -- 组件的生命周期 (这一篇就够了!!!)
欢迎学习交流!!!持续更新中…文章目录原创 2021-10-18 23:25:51 · 409 阅读 · 2 评论 -
React -- 受控组件和非受控组件
欢迎学习交流!!!持续更新中…文章目录受控组件和非受控组件非受控组件受控组件总结高阶函数函数柯里化受控组件和非受控组件包含表单的组件分类有:受控组件和非受控组件非受控组件遵循原理:“现用现取”例:点击“登录”,触发表单的onSubmit,进入handleSubmit回调中,读取两个input框中的数据,就要获取username、password两个节点,最后通过节点.value将结果显示出来<script type="text/babel"> // 创建组件 .原创 2021-10-14 19:21:10 · 181 阅读 · 1 评论 -
React -- 组件的三大属性(state、props、refs)
欢迎学习交流!!!持续更新中…文章目录组件(实例)的三大属性state 属性props 属性refs 属性组件的生命周期组件(实例)的三大属性state 属性state:状态,有状态为复杂组件,无状态为简单组件理解:state是组件对象最重要的属性, 值是对象(可以包含多个key-value的组合)组件被称为"状态机", 通过更新组件的state来更新对应的页面显示(重新渲染组件)注意:组件中render方法中的this为组件实例对象组件自定义的方法中this为undefine.原创 2021-10-11 21:44:40 · 606 阅读 · 5 评论 -
React -- Diff算法
欢迎学习交流!!!持续更新中…文章目录传统 Diff 算法React Difftree diffcomponent diffelement diff总结React中的diff算法是该框架的核心,React diff 会帮助我们计算出 Virtual DOM 中真正变化的部分,并只针对该部分进行实际 DOM 操作,而非重新渲染整个页面,从而保证了每次操作更新后页面的高效渲染。传统 Diff 算法在计算两颗树形结构差异的最优解一直是一个复杂的问题,传统的diff算法,需要遍历整棵树的节点然后进.原创 2021-10-08 20:51:00 · 315 阅读 · 2 评论 -
React -- 函数式和类式组件
欢迎学习交流!!!持续更新中…文章目录模块与组件组件规则注意事项函数式组件(无状态)类方式组件(有状态)组件的三大属性state 属性props 属性refs 属性组件的生命周期模块与组件模块:向外提供特定功能的js程序, 一般就是一个js文件为什么要拆成模块:随着业务逻辑增加,代码越来越多且复杂。作用:复用js, 简化js的编写, 提高js运行效率组件:用来实现局部功能效果的代码和资源的集合(html/css/js/image等等)为什么要用组件: 一个界面的功能更复杂作.原创 2021-09-26 15:45:09 · 791 阅读 · 5 评论 -
React -- 概述、虚拟DOM、JSX、组件与模块
欢迎学习交流!!!持续更新中…文章目录ReactReact 介绍React 特点React 的发展历史React 与 Vue 的对比技术层面开发团队相关资源链接React虚拟DOMReactReact 介绍React 是一个用于构建用户界面的渐进式 JavaScript 库,旨在简化可视化页面开发本身只处理 UI不关系路由不处理 ajaxReact主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。数据驱动视图React 由 Facebook 在.原创 2021-09-13 20:43:58 · 193 阅读 · 2 评论