Linux

tmux

如何查看

tmux如何进行滚动呢?

  1. prefix + [, prefix为tmux的前置动作,默认是ctrl + b
  2. 使用方向键或者pageUp来进行翻页。
  3. q可以退出滚动模式。
  4. 支持vi模式,需要在.tmux.conf里面配置: set -g mode-keys vi

进程号, 端口

ps命令查找与进程相关的PID号,可以通过man来查询ps的一些参数。

这里讲解下最常用的用法: ps aux | grep vim, 查看所有的vim进程。ps aux | grep vim | grep -v grep, 查看所有的vim进程,去处掉当前的grep进程。一般查询出来的结果就是进程的id。

1. linux
// 先查看进程的pid
ps aux | grep vim // 根据进程的pid,使用netstat查看该进程所占用的端口
netstat -nap | grep pid 2. mac
// 直接查询与listen相关的进程所有的情况(端口号和进程号都可以看见)
lsof -i -P | grep -i "listen"

参考

ES6

Object.values

Object.values场景: Object.values(attr.value).some(x => !x), 表示只要有一个为空,则返回true。

但是Object.values浏览器支持的不好,但是Object.keys却支持的非常好,因此可以这样来搞:const values = Object.keys(obj).map(x => obj[x]);

Symbol

Symbol是ES6新引入的一个变量类型,它表示独一无二,可以这样来定义一个独一无二的值,它和任何其他变量都不相等: const a = Symbol('key')

CSS

三列布局,常见的那种等宽三列布局,就是每列的左右距离都是一样的。下面介绍常用的几种方法:

// flex
.parent {
display: flex;
justify-content: space-between;
} // text-align, 它用于inline-block和inline元素
.parent {
display: block;
text-align: center;
} .parent .left {
float: left;
/*absolute*/
} .parent .right {
float: right;
/*absolute*/
} .parent .midde {
display: inline-block;
}

localStorage

有一个需求是,在Table展示页面的时候,点击单条数据跳到新页面,然后新页面点击跳到第三个页面,需要将某个数据在第三个页面里进行展示。由于数据结构比较复杂,如果采用reducer的话,太过于麻烦了, 会花费很多时间。

因此,想了一个比较猥琐的解决办法,就是存到localStorage里面去, 每次点击Table里一条数据的时候,就将该数据存到localStorage里面去。但是后来经过实际测试,测试出来了有bug。

因为,如果一直点击数据,会弹出新的tab页,而每次点击后localStorage里面的值就会被更新掉,所以导致所有要跳转的第三个页面的填充值都是一样的。

can't resolve a module

ES6Module, 自己经常遇到这种情况,就直接慌了,因为感觉自己查不到错,其实很简单的。总结自己的两步:

  1. 先检查路径是否正确。
  2. 检查路径的单词是否拼错。
  3. 检查被引用的JavaScript文件,发现文件名不是index.js, 而是list.js, 因为要改为index.js。这里和脚手架的配置有关系。

mongodb shell

这是真的把自己蠢哭了,因为代码跑了几次,但是数据一点儿变化都没有。后来才发现,自己在shell里面操作的时候,查询出来的数据只是部分的,需要it查看更多的数据,才发现数据是变化了的。

Why is the MongoDB Node Driver generating instance pool destroyed errors?

自己当时不太会写异步,结果数据库操作还没有处理完,但是for循环早已经结束了,因此回调就db.close了,所以导致这样的报错。

react

Map

由于自己写一个简单的map都会报错,要么是eslint,要么是语法规则,总是不能一次性写对。

// 注意map后没有分号
// 要写key
// jsx要有大括号
<ul>
{
data.map((x, index) => {
<li key={index}>{x}</li>
})
}
</ul>

react不能识别odd, even

由于在react里面不能使用odd even这样的伪元素。因此需要自己来单独处理。

可以看这个: 一个简单的解决办法

node

classnames的用法

由于写react的时候,经常会遇到多个类的情况,我这里就不展开总结了,参考这里: classnames

写脚本操作mongodb时提示Error: cyclic dependency detectd_id

说说我遇到的一种场景: 由于要用到某条数据进行操作的时候,没有注意到它是一个对象,然后就循环引用了。

如何插入带有Object_id的数据

解决方案

代码习惯

  1. 表单提交时,可以将表单检测分为2个过程,static error check以及post error check

crm踩坑记(二)的更多相关文章

  1. 【React踩坑记二】react项目实现JS路由跳转

    这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...

  2. crm踩坑记(三)

    React 如何同步更新state 由于setState方法是异步的,而通常很多时候在一个生命周期里更新state后需要在另一个生命周期里使用这个state. 下面介绍几个方法 // 1 this.s ...

  3. Visual Studio For MacOS 踩坑记(二)

    Visual Studio For MacOS安装安卓SDK. 系统默认安装了安卓6.0  API23的SDK.  但是我需要安卓7.0的,API24.  遂安装. SDK可以下载成功,但是用Visu ...

  4. crm踩坑记(一)

    目录 antd es6 Object.entries() Object.keys() Object.getOwnPropertyNames() 很神奇的用法!!! eslint 傻逼 其他 参考 an ...

  5. iOS自动化打包上传的踩坑记

    http://www.cocoachina.com/ios/20160624/16811.html 很久以前就看了很多关于iOS自动打包ipa的文章, 看着感觉很简单, 但是因为一直没有AppleDe ...

  6. [技术博客] 敏捷软工——JavaScript踩坑记

    [技术博客] 敏捷软工--JavaScript踩坑记 一.一个令人影响深刻的坑 1.脚本语言的面向对象 面向对象特性是现代编程语言的基本特性,JavaScript中当然集成了面向对象特性.但是Java ...

  7. Spark踩坑记——Spark Streaming+Kafka

    [TOC] 前言 在WeTest舆情项目中,需要对每天千万级的游戏评论信息进行词频统计,在生产者一端,我们将数据按照每天的拉取时间存入了Kafka当中,而在消费者一端,我们利用了spark strea ...

  8. Spark踩坑记——数据库(Hbase+Mysql)

    [TOC] 前言 在使用Spark Streaming的过程中对于计算产生结果的进行持久化时,我们往往需要操作数据库,去统计或者改变一些值.最近一个实时消费者处理任务,在使用spark streami ...

  9. 【踩坑记】从HybridApp到ReactNative

    前言 随着移动互联网的兴起,Webapp开始大行其道.大概在15年下半年的时候我接触到了HybridApp.因为当时还没毕业嘛,所以并不清楚自己未来的方向,所以就投入了HybridApp的怀抱. Hy ...

随机推荐

  1. php的laravel数据库版本管理器migration

    第一步:连接数据库 打开.env文件.配置DB_HOST DB_PORT DB_DATABASE=LARAVEL DB_USERNAME DB_PASSWORD 注意DB_DATABASE这一项需要自 ...

  2. php测试题

    1. LAMP具体结构不包含下面哪种(A) A:Windows系统 B:Apache服务器 C:MySQL数据库 D:PHP语言 2. 以下哪个SQL语句是正确的(D) A:insert into u ...

  3. 在Visual Studio 2017中使用Asp.Net Core构建Angular4应用程序

    前言 Visual Studio 2017已经发布了很久了.做为集成了Asp.Net Core 1.1的地表最强IDE工具,越来越受.NET系的开发人员追捧. 随着Google Angular4的发布 ...

  4. Java数据类型在实际开发中的应用一

    在前边的博文中,我已经介绍了Java核心的容器IO等,现在我来说一下java中的数据类型.在java中,一切东西皆为对象(这句话意思是java中绝大数情况都用对象),极少数不是对象的,也存在与之对应的 ...

  5. SQL语言-----数据操作

    数据操作 增加数据,insert into 标准格式 insert into 表名 (字段的列表)value(数据列表): 使用set insert into 表名 set 字段1=值,2.....: ...

  6. iconfont字体图标的使用方法--超简单!

    我之前因为项目用bootstrap比较多,所以使用font awesome字体图标比较多,后来接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常强大!之前看了一波教程,觉得繁琐, ...

  7. WM_COPYDATA传送指针数据类型的问题

    WM_COPYDATA传送指针数据的问题 var       cdds:TcopyDataStruct;     strAnsi:string;begin      cdds:=PCopyDataSt ...

  8. wifi扩展设置

    一.主路由器设置 网络参数 LAN口设置查到 MAC地址,用于设置扩展路由器 Bridge功能设置时 AP1的地址 2.无线基本设置,桥的 SSID BSSID 为扩展 3.无线安全设置 二.扩展路由 ...

  9. mysql5.7 date类型无法设置'0000-00-00'默认值

    现象: mysql5.7之后版本datetime默认值设置'0000-00-00',出现异常:Invalid default value for 'create_time' 原因: mysql5.7之 ...

  10. # .NET切面编程——PostSharp

    目录 概念 实现方式 .Net平台的切面实现 PostSharp示例 概念 Aspect-Oriented Programming(AOP):想想OOP是不是有些熟悉,AOP翻译过来的意思就是面向切面 ...