歌谣的博客

原创 让开!!!谁也别拦着我封装React组件！

1简介我是歌谣 放弃很容易 但是坚持一定很酷 喜欢我就一键三连哈2前言在我们的工作生活中 每次学习一个框架我们就不免要封装组件 而具备封装一个完美组件的能力 我称之为"优秀"3准备工作父组件<Geyao/>子组件import React, { Component } from 'react';class GeYao extends React.Component { render() { console.log(this, 'this..

原创 前端面试题汇总

歌谣最全前端面试题（建议收藏，欢迎讨论）【Vue】[vue] 从0到1自己构架一个vue项目，说说有哪些步骤、哪些重要插件、目录结构你会怎么组织

原创 “约见“面试官系列之各系列目录汇总（建议学习收藏）

1.谢谢你那么酷还来关注我，微信公众号GY歌谣，私信可一起学习交流(前端学习ing) 唯一微信号GrievedGeYao 2.18届应届毕业生 本科 三年工作经验 96年 3.想去的地方很远 想买的东西很贵 想守护的东西很美好 所以选择努力。 4拼搏到无能为力，坚持到感动自己

原创 [NodeJs] 如何获取项目的根路径？

[NodeJs] 如何获取项目的根路径？__dirname,process.cwd()个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [NodeJs] 你有使用过npx吗？它主要解决什么问题？

[NodeJs] 你有使用过npx吗？它主要解决什么问题？npm从5.2开始增加了npx命令node自带npm模块,npx命令可以直接使用,如果不能使用,需自行安装.$ npm install -g npxnpx 的原理很简单，就是运行的时候，会到node_modules/.bin路径和环境变量$PATH里面，检查命令是否存在。主要解决问题:切换node版本 在命令行下,调用内部安装模块 避免全局安装模块 执行github上模块代码(前提:远程代码必须是一个模块，即必须包含packag

原创 [NodeJs] 如果发现node_modules中有个模块代码有bug，你该怎么办？

[NodeJs] 如果发现node_modules中有个模块代码有bug，你该怎么办？删除node_modules文件夹 重新npm install如果本身代码有问题，去github对应的模块库提issues个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [NodeJs] 如何使用nodejs对base64进行编解码？

[NodeJs] 如何使用nodejs对base64进行编解码？const str = 'hi'//编码const buff = Buffer.from(str, 'utf-8')console.log(buff)const base64 = buff.toString('base64')console.log(base64)// 解码const buff2 = Buffer.from(base64, 'base64')console.log('---', buff2)con

原创 [ECMAScript] module、export、import分别有什么作用？

[ECMAScript] module、export、import分别有什么作用？import导入模块功能。import导入的只是一个只读引用，等到脚本执行时根据引用才到模块里去取值。这也就是import可以按需加载的原因。export 指定输出的代码module 要在js中使用ES6的import。<script type="module "></script >，script 的type定义为module个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易.

原创 [ECMAScript] es6对函数做了哪些优化？

[ECMAScript] es6对函数做了哪些优化？1.函数参数可以设置默认值function getUserCompanyName(name='defaultUser',company='defaultCompany'){ return name+company }2.属性简写,属性的key和value相同可以进行简写3.rest参数(剩余参数)4.箭头函数 ()=>{}个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌

原创 [ECMAScript] 说说你对class的理解

[ECMAScript] 说说你对class的理解语法糖，本质上还是function个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [ECMAScript] 你喜欢es6的哪些特性？

[ECMAScript] 你喜欢es6的哪些特性？展开操作符解构赋值字符串插值方法属性find findIndex IncludesPromiseESM个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [ECMAScript] 说说你对async/await的理解？

[ECMAScript] 说说你对async/await的理解？async函数返回的是一个promise对象，它可以用then方法添加回调函数。当函数执行的时候一旦遇到await就会阻塞后面的代码，等待promise的resolve() 作为await的返回结果。个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [ECMAScript] 说说你对Babel的了解？

[ECMAScript] 说说你对Babel的了解？1.将es6/7/8/9/10转换为es52.将jsx转换为js个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [ECMAScript] 谈谈你对es6的module体系的理解

[ECMAScript] 谈谈你对es6的module体系的理解es5的模块规范出来之前，前端也实现了比如AMD CMD模块规范，对前端模块进行管理。es6的模块规范在语言层面实现了模块功能为什么需要模块化，没有模块化之前，开发者如果想封装代码，需要创建多个文件，并将这些文件作为单独脚本项目复杂度大的话，链接的文件就多。而且还存在污染全局命名空间的问题，因为这些js脚本中的变量都挂载到全局window对象上，可能产生覆盖，而且你也不知道你用的xx变量是在哪个文件定义的。要想办法将变量放在函

原创 [ECMAScript] 说说你对set数据结构的理解

[ECMAScript] 说说你对set数据结构的理解似于数组，但它的一大特性就是所有元素都是唯一的，没有重复。在向Set加入值时，Set不会转换数据类型，内部在判断元素是否存在时用的类似于精确等于(===)的方法，“2”和2是不同的，NaN等于其自身。个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 [ECMAScript] 举例说明你对es6的class的理解

[ECMAScript] 举例说明你对es6的class的理解class实际上就是封装了构造函数，本质上class类就是一个函数个人简介我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，但坚持一定很酷。欢迎大家一起讨论主目录与歌谣一起通关前端面试题...

原创 React开发（284）:注意点击事件大小写

原创 React开发（283）:控制文件不会被git追踪

之后 在本地执行 git update-index --assume-unchanged src/models/menu.js 然后再修改 就不会被 git 追踪到 就可以随便修改了

原创 React开发（282）:公共组件可以提升一下文件层级

原创 React开发（281）:一定是路由错误

原创 React开发（280）:moment处理日期

<div style={{ display: 'flex' }}> <span className={style.infoSpan}> <span>联系地址：</span> <span>{basicLecturerEntity.address}</span> </spa...

原创 React开发（279）:ant design 改变按钮状态判断方式

list: (text, row) => { let arr = []; if (row.status === SHSTATUS) { arr.push({ name: '审核', onClick: () => { this.handleRever(row); }, }); ...

原创 React开发（278）:ant design message res保证正确信息提示

callback: (res) => { console.log(res, 'res'); if (res === true) { message.success('操作成功'); this.props.dispatch({ type: 'lecturer/updateState', payload: { selectedRowKeys: [] }, });..

原创 React开发（277）:ant design time刚进入页面时间重置

activityTimeStamp.length === 0 ? null : [moment(activityTimeStamp[0]), moment(activityTimeStamp[1])],

原创 React开发（276）:dva 处理成数组的方法

export function getListDefault(data, key) { let list1 = data[key]; console.log(list1, 'list1'); let list = Object.keys(list1) .filter((item) => item !== 'defaultValue') .map((item) => list1[item]); console.log(list, 'list'); let de.

原创 React开发（275）:dva debugger对应的值

原创 React开发（274）:ant design 时间显示秒

{getFieldDecorator('assessTimeStamp', { initialValue: [ moment(updateDataSource.assessStartTime), moment(updateDataSource.assessEndTime), ], })(<RangePicker format="Y...

原创 React开发（268）:debounce is not a function报错

重名错误

原创 React开发（274）:ant design table额外展开行

原创 React开发（273）:异步调用的方式

1、回调函数方式doFirstThing((err, data) => { if (err) { console.log(err); return; } doSecondThing(data, function(err, data){ if (err) { console.log(err); return; } doThirdThing(data

原创 前端软技能面试汇总

【软技能】[软技能] 在前后端分离项目里，请说说前端传递的token的流程？[软技能] 现如今面对如层出不穷的类库，说说你的感受[软技能] 你认为计算专业和非计算机专业的差别在哪？为什么？[软技能] png-8和png-24有什么区别？[软技能] 请说说使用iconfont图标的优点和缺点...

原创 前端面试题node.js汇总

【NodeJs】[NodeJs] 你有使用过npx吗？它主要解决什么问题？[NodeJs] 如何使用nodejs对base64进行编解码？[NodeJs] npm提供了哪些钩子？各有什么作用？[NodeJs] 如果发现node_modules中有个模块代码有bug，你该怎么办？[NodeJs] 如何获取项目的根路径？...

原创 前端面试题vue-element汇总

【Vue-element】[vue-element] ElementUI是怎么做表单验证的？在循环里对每个input验证怎么做呢？[vue-element] 你有二次封装过ElementUI组件吗？[vue-element] ElementUI怎么修改组件的默认样式？[vue-element]ElementUI的穿梭组件如果数据量大会变卡怎么解决不卡的问题呢？[vue-element] ElementUI表格组件如何实现动态表头？[vue-element] ElementUI使用表格组件时有遇到

原创 前端面试题Vue-cli目录汇总

【Vue-cli】[vue-cli]vue-cli3你有使用过吗？它和2.x版本有什么区别？[vue-cli]vue-cli默认是单页面的，那要弄成多页面该怎么办呢[vue-cli]不用vue-cli，你自己有搭建过vue的开发环境吗？流程是什么？[vue-cli]怎么使用vue-cli3创建一个项目？[vue-cli] 说下你了解的vue-cli原理？你可以自己实现个类vue-cli吗？[vue-cli] 你知道什么是脚手架吗？[vue-cli] vue-cli中你经常的加载器有哪些？[v

原创 React开发（272）:try...catch..捕获

//通过接口获取list handleSearchList = async (url) => { try { const res = await url(); if (res.data && res.data.length > 0) { this.setState({ thirdList: res.data, showThird: true, tabName: ''..

原创 前端javascript面试题目录汇总

【JS】[js] 请使用js实现一个秒表计时器的程序[js] 模拟 localStorage 时如何实现过期时间功能[js] 请使用js实现商品的自由组合，并说说你的思路[js] js中的undefined和 ReferenceError: xxx is not defined 有什么区别？[js]JavaScript Number.toPrecision() 函数详解[js] 获取浏览器当前页面的滚动条高度的兼容写法[js] 一道变态题 Number.call.call(Number, u

原创 React开发（271）:UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated e

原因：没有进行promise的差错处理解决方案：加一个catch语句.catch(err => { console.log(err); })

原创 React开发（265）:ant design InputNumber

## 所有输入价格的地方，都使用InputNumber 组件```javascript// formatter 和 parser <InputNumber style={{ width: '100%' }} value={baseInfo.minRepeatedlyAmount} onChange={(value) => this.handleChangeFormData(value, 'minRepeatedlyAmount')} formatter={(value.

原创 React开发（266）:ant design customRequest

原创 React开发（267）:ant design upload简单上传

## 如果只是简单的上传，没必要写 customRequest```javascript <Upload name="file" action={`${BASE_URL}/common/file/uploadByStream`} headers={{ authorization: localStorage.getItem('token'), 'x-sys-encode': '115992066215908888170874', 'x-sys-ter.