![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
前端相关文档
小小前端_可笑可笑
这个作者很懒,什么都没留下…
展开
-
alita框架背景及其框架结构
2020.07.06早会总结 (修改:2020.07.10 1. 技术栈2. umi3. ant-design3.1 目前适配3.2 适用场景:3.3 友好性:3.4 使用4. alita4.1 apptype4.2 alita致力于4.3 工程结构4.3.1 config/config.ts4.3.2 mock/app.ts4.3.3 src/assets/4.3.4 src/models/4.3.5 src/pages4.3.6 src/services/api.ts4.3.7 src/app.ts原创 2020-07-14 17:02:10 · 879 阅读 · 0 评论 -
关于项目中package.json文件分析
package.json文件分析简介作用内容一个package.json文件内容简介有使用框架开发过项目的小伙伴都知道,每个项目中都含有一个叫package.json的文件,那么是否你究竟对它了解有多少呢?本文我会讲解一些我对它的个人理解。作用package.json文件是npm init命令初始化后,在项目的根目录下自动生成的配置文件,它定义了这个项目的配置信息以及所需要的各种模块。有这个文件之后,运行npm install命令,会自动下载项目所需的所有依赖模块,这些依赖会加载到更目录的原创 2020-07-15 17:57:54 · 581 阅读 · 0 评论 -
Props和State的使用与理解
Props和State的使用与理解1. Props2. State一个问题1. Props在 官方文档 中,我们能够很快理解Props这个属性的使用方法:Props可以获取到当前组件中所包含的属性,并且获取到对应的数据。例1:function MyExample(props) { return <h1>{props.value}</h1>; // 利用props来获取组件MyExample中的值}ReactDOM.render( <MyExample valu原创 2020-07-07 14:14:55 · 294 阅读 · 0 评论 -
之前学习Vue与现在学的React初体验
Vue与在学的React初体验1. 个人使用感觉2. 在网站中添加React时遇到的问题1. 个人使用感觉Vue最大的优势是数据的双向绑定,开发人员不用在乎数据如何在页面中渲染,只需要在业务层面更改绑定的对应数据。React则是单向数据流,当要更改一个数据时,我们需要这只一个state,通过判断组件是否变化,当变化之后会出发render()函数,再将新的数据重新渲染到页面中。个人感觉Vue更加直观,React则相对复杂。2. 在网站中添加React时遇到的问题一开始学习时不是建一个React原创 2020-07-07 09:50:25 · 173 阅读 · 0 评论 -
(随手记)JavaScript 事件委托(委派)概念
JavaScript 事件委托概念概念用到的知识:事件冒泡当对相同的标签绑定相同类型的事件时,我们可以将其事件绑定到其统一的父元素之上,出发其子元素之后会通过事件冒泡出发父类上的事件原创 2020-05-28 12:10:52 · 125 阅读 · 0 评论 -
谈一谈mock数据
Mock数据什么是Mock数据?Mock数据有什么作用?我们如何使用Mock数据?如何自己编辑Mock文件?什么是Mock数据?约定 /mock 文件夹下所有文件为 mock 文件,mock文件中定义的数据称作mock数据。如alita项目中的mock/app.ts,app.ts称为mock文件,其中定义的数据称作mock数据。(Vue中常被定义为index.js)Mock数据有什么作用?Mock 数据是前端开发过程中必不可少的一环,是分离前后端开发的关键链路。通过预先跟服务器端约定好的接口原创 2020-07-09 21:19:56 · 1217 阅读 · 0 评论 -
JS闭包产生条件、作用、生命周期
闭包1. 闭包的概念2. 闭包产生条件1. 闭包的概念闭包就是能够读取其他函数内部变量的函数,或者子函数在外调用(子函数所在的夫函数的作用域不会被释放)。2. 闭包产生条件函数嵌套例如:function A() { function B() { }}内部函数引用了外部函数中的数据(属性、函数)例如:function A() { var a = "a"; function B() { console.log(a); }}执行外部函数(也可理解原创 2020-06-07 00:27:33 · 908 阅读 · 0 评论 -
alita项目中的动态路由配置
alita项目中的动态路由配置什么是动态路由静态路由和动态路由的区别alita项目中配置动态路由配置创建一个动态路由文件配置之前页面配置(`src/pages/testpage/[index].tsx`)全局布局配置(`src/layouts/index.tsx`)在nextpage页面中配置`[index].tsx`向`models`传递路由信息`models`接收数据并传递出去-什么是动态路由动态路由是指路由器能够自动地建立自己的路由表,并且能够根据实际情况的变化适时地进行调整。百度百科静态路原创 2020-07-14 14:05:59 · 391 阅读 · 0 评论 -
JavaScript DOM的增、删操作,并实时显示到表格中(JS代码含详细注释)
JavaScript DOM的增、删操作,并实时显示到表格中一、说明二、实现代码三、一点备注一、说明给所有的a标签绑定事件判断点击的del属于哪一行数据删除当前行的tr节点获取添加表中的所有input数据添加tr和td节点向新建的td节点中添加数据(数据来源与4.)给新建的行中的a标签绑定事件二、实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">原创 2020-05-24 15:27:50 · 370 阅读 · 0 评论 -
JavaScript 实现全选、不全选、反选功能(有详细注释)
JavaScript 实现全选、不全选、反选功能一、我们需要考虑的点二、代码实现三、一点备注一、我们需要考虑的点获取元素对象判断哪些checkbox被选择全选时将所有选项都选上不全选时将所有选项撤销反选时如何实现点击每一小项时判断是否已经被全选或全不选反选时判断是否全选或不全选二、代码实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta原创 2020-05-23 23:29:50 · 386 阅读 · 0 评论 -
alita项目中的数据流(数据定义到最终页面使用全过程)
alita项目中的数据流整体状况;mock数据的定义到使用全过程。原创 2020-07-13 18:11:01 · 461 阅读 · 0 评论 -
alita中组件的自定义与组件的再封装
alita中组件的自定义与组件的再封装前情提要自定义组件如何自定义components文件夹test.tsx文件页面中导入组件一个最简单的组件向组件里传递参数定义默认参数组件再封装前情提要在alita项目开发过程中,常常会用到很多包装好的组件,如antd中的所有组件。别人封装好的组件很多情况下总是不符合自己的口味,那么今天就讲一讲如何自定义组件以及对已有组件的再封装。自定义组件如何自定义我们都知道,若要使用antd中的某个组件,需要一个import操作(如:import { Button } f原创 2020-07-16 18:08:08 · 305 阅读 · 1 评论 -
JavaScript 内存、变量、数据
数据、变量、内存1. 什么是数据2. 什么是变量3. 什么是内存4. 内存、数据、变量之间的关系1. 什么是数据在内存中指代特定的定西,本质上是010101…特点:可传递、可运算一切都为数据内存中的所有东西:数据– 算数运算– 逻辑运算– 赋值运算– 函数运算(函数运行)2. 什么是变量可以变化的量,变量名+变量值每个变量都对应一个内存地址,变量名查找对应的内存位置,变量值则为这个内存位置存储的数据值3. 什么是内存内存条通电之后产生的可存储数据的空间内存空间:内存条原创 2020-06-03 20:15:46 · 328 阅读 · 0 评论 -
JavaScript onmousemove事件实现物体随鼠标移动
JavaScript onmousemove事件实现物体随鼠标移动代码代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style原创 2020-05-27 11:52:43 · 1007 阅读 · 0 评论 -
JS 事件冒泡概念,冒泡消除
事件冒泡一、概念二、验证代码一、概念条件:子元素和父元素具有相同的事件现象:当触发子元素中的事件时,父元素中相应的事件也会被触发消除:提供了一个cancelBubble属性(event.cancelBubble)二、验证代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-原创 2020-05-28 11:55:05 · 251 阅读 · 0 评论 -
JS数据类型(null与undefined、null用法、变量类型与数据类型)
数据类型1. undefined和null的区别2. 什么时候给变量赋值为null3. 严格区分变量类型与数据类型3.1 数据类型:3.2 变量类型:1. undefined和null的区别undefined表示定义了但没有赋值null表示定义并赋值,但是值为null2. 什么时候给变量赋值为null初始赋值为null,表示要赋值为对象结束时,让其成为垃圾对象3. 严格区分变量类型与数据类型3.1 数据类型:基本类型对象类型3.2 变量类型:基本类型(保存基本类型的值)原创 2020-06-03 19:30:55 · 270 阅读 · 0 评论