前端
de_la_prada
这个作者很懒,什么都没留下…
展开
-
css margin 0 auto什么时候才能起到水平居中的效果
根据stack overflow的回答:What, exactly, is needed for “margin: 0 auto;” to work?必须满足以下几个要求:块级元素,比如:display: block或者display: table不能是浮动元素(float)position不能是fixed或absolute必须设置固定的width...原创 2021-03-17 10:54:45 · 394 阅读 · 0 评论 -
数据量大导致传输速度慢解决方案——请求分片
前言在开发过程中,遇到要请求几千行数据的需求,因为前端部分已经使用了VirtualList虚拟列表只渲染当前可视区域的视图,非可视区域的视图在用户滚动到可视区域再渲染:但仍不能解决数据加载缓慢问题。原因是数据量本身太大,导致传输的速度过慢,所以渲染到页面上的速度也很慢。解决方案用请求分片的方式,先加载前50条数据,监听滑动到底部的事件,当列表下拉到底部的时候,再去请求后一百条数据。这么做每次只请求50条数据,传输速度就会很快。前端具体实现如下:function PoemList() {原创 2021-03-14 08:52:32 · 2468 阅读 · 0 评论 -
package.json不显示安装的依赖
在安装包的时候加上参数–save或–save-dev。–save会将包放在dependency里,–save-dev会将包放在devDependency里,devDependency里的包指的是只在开发环境下会用到的包,在生产环境下不会被打包。原创 2021-01-21 09:19:48 · 1549 阅读 · 0 评论 -
npm安装失败及解决办法 error network tunneling socket could not be established
最近在使用npm安装create-react-app时出现了如下报错,切换淘宝镜像也无法解决,仍然出现这种错误。完整报错为:error network tunneling socket could not be established, cause=connect ECONNREFUSED 127.0.0.1:12639error network This is a problem related to network connectivity.error network In most cases原创 2020-12-09 10:18:30 · 5975 阅读 · 3 评论 -
react.lazy react.suspense实现动态引入组件
React.lazy和Suspense的功能主要是利用了webpack对es6的import动态载入组件,可以自动实现Code Splitting。Code Spliting,即代码分割,能够“懒加载”当前用户所需要的内容,显著提高应用的性能。尽管并没有减少应用整体的代码体积,但可以避免加载用户永远不需要的代码,并在初始加载的时候减少所需加载的代码量。React.lazyReact.lazy函数能让你像渲染常规组件一样处理动态引入(的组件)。使用之前:import OtherComponent f原创 2020-10-09 19:48:46 · 1196 阅读 · 0 评论 -
TypeError: Right-hand side of ‘instanceof‘ is not an object jest
在用jest来写单元测试时,遇到了rt的报错.解决方法为将enzyme渲染组件的方法,由mount改为shallow.使用mount:报错:使用shallow通过:原创 2020-09-29 14:57:53 · 574 阅读 · 0 评论 -
hexo 打包后css js无法加载问题
前言将hexo部署到服务器上,需要在命令行执行hexo generate,生成打包好的文件夹public。参考部署至Web服务器,public里的所有文件需要放置在Nginx目录下的某个文件夹中(一般根据项目配置自定义),例如我们项目是放在/home/dwt-best-practice/下:此时部署后,会发现打开页面是没有css和js效果的,F12看console会发现是因为资源路径加载问题。解决方案在站点配置文件根目录/_config.yml中配置URL:根据在Nginx服务器上配置的ser原创 2020-08-25 12:58:10 · 1991 阅读 · 0 评论 -
怎么做好一个项目 记一次项目开发经验
上个月的实训课程是需要我们小组组队完成一个和区块链相关的积分链项目,涉及区块链,智能合约编写,后端,前端,大家开发经验都不是很多,踩坑很多,在此记录一下项目开发过程遇到的坑。自己是负责前端部分,所以就对前端部分进行总结。项目前期需求分析和用例设计项目一开始时老师让我们第一周先写出一份详细的需求分析,当时觉得很繁琐来着,越到后期越发现,需求分析很重要。在这个阶段写的各个用例,是之后你画页面原型,写页面最需要参考的东西,所以必须要写好这一部分。以下是我们小组写的一些用例:画uml的工具是在youtu.原创 2020-06-26 17:10:42 · 864 阅读 · 0 评论 -
react 使用localStorage存储用户登陆状态
本文启发自https://www.youtube.com/watch?v=Y4NHqDp88lA网站的登陆功能可以涉及到很多各种鉴权相关的知识,比如用户尚未登陆前无法访问网站内的其他页面,用户登陆之后访问登陆页会跳转到首页(因为已经执行了登陆操作了,按道理用户不应该还能够访问登陆页面)。这些功能的实现可以借助localStorage和react-router-dom的Redirect方法实现。...原创 2020-06-21 15:55:52 · 3751 阅读 · 0 评论 -
react 修改antd主题色
antd的主题色默认是蓝色的,但是看到官网上有很多配色很好看,所以想换个颜色试试,官网提供的色系:安装antd less less-loader babel依赖npm i antd less less-loader babel-plugin-import @babel/plugin-syntax-jsx这里需注意,less最好安装@5.0.0版本,不然后续会报兼容的错(目前不知道@6以上要如何解决)。然后需要在项目中运行npm run eject来在项目根目录中生成config配置文件夹(若已生原创 2020-06-12 16:55:15 · 6643 阅读 · 0 评论 -
Node——Connect和Express
前言Connect和Express是两个热门的Node模块。Express就是在Connect的基础上,通过添加高层糖衣扩展和搭建出来的。博客地址:https://delaprada.comConnect创建简单的Connect程序指令:npm install connect@3.4.0在要安装的模块后加@可以指定版本号简单的Connect程序应该是这样的:const ...原创 2020-04-05 16:00:59 · 685 阅读 · 0 评论 -
vue 解决mounted不重加载子组件问题
有时需要在父组件中重复加载同一个子组件,但会出现子组件不重新加载的问题。解决方法:在子组件外加一个div框住它:这样,父组件的数据就可以在每次加载子组件的时候传入到子组件中...原创 2019-11-05 15:57:42 · 3760 阅读 · 0 评论 -
CSS布局
position属性静态定位(position:static):只是意味着“将元素放入它在文档布局流中的正常位置 ——这里没有什么特别的。相对定位(position:relative):只是定义position:relative,代码不会有变化,欲修改元素的位置,要使用top,bottom,left和right属性。top:30px;left:30px;绝对定位(positi...原创 2019-08-22 21:47:53 · 101 阅读 · 0 评论 -
Javascript for in和for of的区别
for in: 遍历数组索引,数组的值,对象属性如果改为console.log(i),输出的则是索引i的值for in 更适合遍历对象,尽量不使用for in遍历数组参考for in和 for of的区别for of: 适用于遍历数组,数组对象,但不适用与遍历普通对象i直接是数组的值参考for、forEach 、for in、for of 循环的区别...原创 2019-08-21 19:53:03 · 143 阅读 · 0 评论 -
JavaScript——can not set property "comLength" of undefined
问题描述为对象数组添加新的属性的时候,无法简单的直接用 .操作或者[]操作实现:参考JavaScript中对象数组,如何给对象添加一个新属性会出现set property of undefined的错误,因为我没有对postlist[a]进行定义,这样的话postlist[a]就会被定义为undefined,然后我们不能够set property of undefined,这是问题的原因。...原创 2019-08-21 15:44:50 · 294 阅读 · 0 评论 -
vue项目 v-for无法渲染问题
使用map()函数可能是解决了对象指向问题,目前还不知道原因。postlist_fav2是在data()中定义的数组,在created()里对postlist_fav2进行了数组对象的初始化操作,然后就无法渲染,使用map方法才能渲染到页面上参考Vue项目中v-for无法渲染数据...原创 2019-08-21 15:31:05 · 4142 阅读 · 0 评论