- 博客(29)
- 收藏
- 关注
RSS订阅原创 Hook特性
一、什么是Hook特性目前React的组件定义方式主要有两种：函数组件和类组件。其中，类组件虽支持内部状态State并由于丰富的生命周期函数，但仍未改变JavaScript原型的本质；而函数组件虽是定义组件最简单的方式，但无法进行状态管理。在React 16.8版本中，推出了Hook特性。Hook是一个特殊的函数，它可以让你“钩入”React的特性，即在函数组件中也能使用State及其他的React特性，不必定义Class组件。二、针对State的Hook：State HookSta.
2022-03-31 13:23:32
733
原创 Windows上PowerShell默认禁止运行 *.ps1 脚本原因与解决方法
一、问题描述当调用express包中的“.\build.ps1”脚本时，由于安全系统的设置，终端会阻止‘.ps1’类型的脚本文件运行，导致指令无法执行二、解决方法1、以管理员身份打开PowerShell2、获取有效的执行策略列表Get-ExecutionPolicy -List以上说明的是：有效的执行策略是RemoteSigned，因为当前用户的执行策略优先于为本地计算机设置的执行策略。3、设置执行策略set-executionpolicy rem...
2022-03-22 16:35:20
8228
1
原创 阿里iconfont使用
一、作为图标引用1、选择需要的icon，点击下载按钮，将icon以png格式下载至本地2、将下载好的图标放入项目对应文件夹中3、在需要使用对应图标的界面中先引入图标路径import diary from '../../assets/images/Flexbar/diary.png'4、 使用标签<img>引用图标<img src={diary} alt='' />二、作为代码引用1、将所需图标加入至购物车2、当选好..
2022-02-22 23:08:38
384
原创 Redux
一、组成（一）State-状态（数据）即为传递的数据，大致可分为三类：DomainDate：可以理解为服务器端的数据，比如：获取的用户信息，商品列表等 UI State：决定当前UI展示的状态，比如：弹窗的显示与隐藏，受控组件等 App State：App级别的状态，比如：当前当前是否请求loading，当前路由信息等可能被多个和组件去使用的到的状态 （二）Action-事件（存储数据）Action是把数据传到store的载体，它是store数据的唯一来源，一般来说，我们可以通...
2022-02-14 16:45:09
410
原创 Vscode添加快捷代码片段
1、文件=>首选项=>用户片段2、选择新建代码片段并为其设置文件名3、在新建的文件中按以下格式设置自定义快捷代码段即可4、这样就可以通过快捷键去调用自己设置好的代码片段了：...
2021-09-30 21:09:24
1179
原创 清除React项目运行时控制台无用的警告
一、引入antd产生的黄色报错You are using a whole package of antd-mobile, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.原因是antd希望按需引入，但以import{TabBar}from"antd-mobile";形式引入时实际上会在底层将所有组件引入，因此会报此错误，目前找不到合适的方法来清除。二、A str...
2021-09-22 19:52:49
2391
原创 react 子组件无法跳转显示“push“underfind
由于此时的history需要父组件提供，因此在调用子组件时，父组件需进行传参：<FlexBar navs={navs} history={this.props.history} />同时子组件通过props.history.push(path)即可实现跳转：<Flex className="nav"> {props.navs.map(item => ( <Flex.Item key={item.id}
2021-09-20 22:23:21
171
原创 React项目搭建
一、创建项目1、cmd切换到目标文件夹2、初始化项目npx create-react-app init-mobile3、切换到对应目录根据提示启动项目二、配置项目文件目录调整项目中src目录结构如下：三、引入组件库antd-mobile1、安装npm install antd-mobile --save2、在App.js根组件中导入要使用的组件App.js中直接引用即可，无需加载import { Button } from 'antd-...
2021-09-18 08:54:43
269
原创 React原理
一、setState（一）异步性setState是异步更新数据的：以下代码执行结构中log打印出来的数据是1，表示setState是在log后被执行的，是一个异步操作state = { number: 1 } add = () => { this.setState({ number: this.state.number+1 }) console.log(this.state.number) // 1 }这种异步性会导致.
2021-09-13 22:04:31
122
原创 React-Start
一、JSX（一）基本使用1、React元素的属性名使用驼峰命名法2、特殊属性名：class->className、for->htmlFor、tabindex->tabIndex3、推荐：使用小括号包裹JSX，从而避免JS中的自动插入分号陷阱（二）在JSX中嵌入JS表达式用{}包裹JS表达式1、调用变量const name = 'Bob'const dv = ( <div>Hello, my name is {name}</d.
2021-09-03 17:21:02
238
原创 Js-技巧
目录1、数组去重2、转换数字类型/字符串3、性能追踪（测试耗时）4、数组扁平化1、数组去重常规：双层for循环去重function unique(arr) { for (let i=0; i<arr.length; i++) { for (let j=i+1; j<arr.length; j++) { if (arr[i] === arr[j]) { arr.splice(j, 1); j--;
2021-08-27 10:05:32
94
原创 预处理器Less
一、简介less是一种动态样式语言，属于css预处理器的范畴，它扩展了css语言，增加了变量、Mixin、函数等特性，使css更易于维护和扩展less既可以在客户端上运行，也可以借助Node.js在服务端运行。二、基础（一）变量less可以通过“@”定义变量：@color:pink; // 属性值变量@m:margin; // 属性名变量@selector:#wrap; // 选择器变量* { @{m}: 0; backgroun
2021-08-26 17:58:51
164
原创 webpack
一、基础（一）简介1、webpack是什么webpack是一种前端资源构建工具，一个静态模块打包器（module bundler）。在webpack看来，前端的所有资源文件(js/json/css/img/less/...)都会作为模块处理。它将根据模块的依赖关系进行静态分析，打包生成对应的静态资源（bundle）。2、打包过程：首先项目需要有一个入口文件index.js，webpack以它为起点开始打包，它会根据里面的每一个依赖去创造一个依赖关系树状结构图，按先后顺序一次..
2021-08-23 18:00:21
59
原创 node.js
目录一、简介（一）CommonJS规范（二）Node的用途二、模块化三、包与npm（一）包简介1、包 package2、包结构3、包描述文件package.json（二）npm1、简介2、常用命令3、搜索包四、文件（一）Buffer缓冲区1、简介2、创建buffer3、alloc与allocUnsafe（二）文件系统（File System）1、简介2、同步&异步3、文件的写入4、文件读取一、简介
2021-08-23 16:00:40
120
原创 JS-BOM
一、概述（一）概念BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。BOM由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。（二）与DOM的区别DOM BOM 文档对象模型 浏览器对象模型 把文档当作一个对象来看待 把浏览器当作一个对象来看待 顶级对象是document 顶级对象是window 主要学习的是操作页面元素 学习的是浏览器窗..
2021-08-20 12:04:45
87
原创 JS高级-函数
一、原型与原型链（一）函数的prototype1、函数的prototype属性 每个函数都有一个prototype属性，它默认指向一个Object空对象（即称为：原型对象）//找爹 原型对象中有一个属性constructor， 它指向函数对象 //找儿子2、给原型对象添加属性（一般都是方法） 作用：函数的所有实例对象自动拥有原型中的属性（方法）（二）显示原型与隐式原型1、每个函数function都有一个protot...
2021-08-18 18:00:46
188
原创 JS高级-基础
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言 一、pandas是什么？ 二、使用步骤 1.引入库 2.读入数据 总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分
2021-08-18 15:30:36
97
原创 Js-DOM
一、概念D: Document文档 -表示的就是整个HTML网页文档O： Object对象 -表示将网页中的每一个部分都转换为了一个对象M： Model模型 -使用模型来表示对象之间的关系，这样方便我们获取对象JS中通过DOM来对HTML文档进行操作...
2021-08-17 12:06:35
137
原创 js-基础
立即执行函数函数定义完，立即被调用，这种函数叫做立即执行函数实现：下方为一个匿名函数，用（）将其包起来形成一个闭包，再通过（）进行函数调用(function () { console.log('hello world');})()||var hello = function () { console.log('hello world');}hello()作用域作用域指一个变量作用的范围1、全局作用域直接编写在script标签的JS代码，都在全局作用域.
2021-08-16 18:04:18
169
原创 Vue项目搭建
1、创建项目1、cmd切换到目标文件夹2、执行命令创建项目(项目名称：vue-init-webpack） vue init webpack vue-init-webpack3、选择配置参数：? Project name (vue-init-webpack) 项目名称，回车 ? Project description (A Vue.js project) 项目描述，回车 ? Author ...
2021-08-13 15:12:19
195
原创 Pormise
1、介绍Promise是异步编程的一种解决方案。什么时候会处理异步事件？一种很常见的场景应该就是网络请求了。 我们封装的一个网络请求的函数，因为不能立即拿到结果，所以不能像简单的3+4=7一样将结果返回 所以我们往往会传入另外一个函数，在数据请求成功时，将数据通过传入的函数回调回去。 如果只是一个简单的网络请求，那么这种方案不会给我们带来很大的麻烦。但是，当网络请求非常复杂时，就会出现回调地狱：在上面的代码中，我们需要通过一个url1从服务器加载一个数据data1，而dat..
2021-08-11 16:10:24
219
原创 vue-router
1、箭头函数什么时候用箭头函数？当需要将一个函数作为参数传到另外一个函数时<script> // 1、参数问题 // 1.1没有参数 const x1 = () => { } // 1.2一个参数 （一个参数时可省略括号） const x2 = num => { return num + num } // 1.3两个参数 const x3 = (num1, num2) =>.
2021-08-11 10:05:05
126
原创 Vuex
Vuex是做什么的官方解释：Vuex是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 Vuex也集成到Vue的官方调试工具devtools extension，提供了诸如零配置的time-travel调试、状态快照导入导出等高级调试功能。状态管理：即将多个组件需要共享的变量全部存储在一个对象里面，然后将这个对象放在顶层的Vue实例中，让其他组件可以使用 。为实现这种状态管理，并使共享变量变成响应式..
2021-08-08 20:15:58
61
原创 模块化的导入导出
导出export1、在export下将需要导出的数据罗列出来let name = '李华'let age = 18let flag = truefunction sum(num1, num2) { return num1 + num2}export { flag, sum}2、在定义变量之前直接加exportexport var name = '小明'3、导出函数/类export function sub(num1, num2) { return n.
2021-08-07 22:07:50
93
原创 ES6新增语法
1、let/var/constES5之前因为if和for都没有块级作用域的概念，所以在很多时候，我们都必须借助于function的作用域来解决应用外面变量的问题。 ES6中，加入了let，let它是有if和for的块级作用域（ES5中的var是没有块级作用域的）。 const：将变量定义为常量（不可修改），开发中优先使用const，需要修改值时再用let注：const修饰对象时只是对象不能被修改，但是对象内的属性可以修改2、对象增强写法属性的增强写法const name = 'Pet.
2021-08-05 16:37:56
178
原创 Vue-基础操作
操作1、插值操作即将data中设置好的message的值插入到{{message}}中各种属性： v-once <span>{{number}}</span><span v-once>{{number}}</span>上面的number会随data中的变化而变化，而下面由于存在v-once属性，第一次赋值后number的值将不再随daat改变。v-html将data中的html语言识别转换<span>..
2021-08-05 15:10:40
137
原创 Vue-Start
一、认识Vue渐进式可以将Vue作为项目一部分嵌入（如果有一个用jQuery写的项目需要改为Vue，可以直接在编写新界面时使用Vue即可，也就是说一个项目可以同时存在两种框架编写）特点（高级功能）解耦视图和数据 可复用的组件 前端路由技术 状态管理 虚拟DOM二、尝试Vue定义之前使用的是var，但在ES6中一般使用let和const（一个定义变量一个定义常量）挂载（一个简单计数器的小例子）<head> <meta charset="UT.
2021-08-05 09:34:21
284
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人