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. JAVA基础——面向对象三大特性:封装、继承、多态

    JAVA面向对象三大特性详解 一.封装 1.概念: 将类的某些信息隐藏在类内部,不允许外部程序直接访问,而是通过该类提供的方法来实现对隐藏信息的操作和访问. 2.好处: 只能通过规定的方法访问数据. ...

  2. 再谈AbstractQueuedSynchronizer:共享模式与基于Condition的等待/通知机制实现

    共享模式acquire实现流程 上文我们讲解了AbstractQueuedSynchronizer独占模式的acquire实现流程,本文趁热打铁继续看一下AbstractQueuedSynchroni ...

  3. python webserver, based on SimpleHTTPServer

    #-*- coding:utf-8 -*- #author: lichmama #email: nextgodhand@163.com #filename: httpd.py import io im ...

  4. twemproxyMemcache协议解析探索——剖析twemproxy代码正编补充

    memcache是一种和redis类似的高速缓存服务器,但是memcache只提供键值对这种简单的存储方式,相对于redis支持的存储方式多样化,memcache就比较简单了.memcache通过tc ...

  5. 奇舞js笔记——第0课——如何写好原生js代码

    摘要 1.好的代码职责要清晰,javscript不要用来操作样式: 2.API要设计的合理:通用性,适度的抽象(数据抽象,过程抽象),可扩展性: 3.效率问题:用好的.合适的算法(前端程序员要把自己当 ...

  6. 【Python3之多线程】

    一.threading模块 multiprocess模块的完全模仿了threading模块的接口,二者在使用层面,有很大的相似性. 1.开启线程的两种方式(同Process) 方法一 from thr ...

  7. Spark源码阅读之存储体系--存储体系概述与shuffle服务

    一.概述 根据<深入理解Spark:核心思想与源码分析>一书,结合最新的spark源代码master分支进行源码阅读,对新版本的代码加上自己的一些理解,如有错误,希望指出. 1.块管理器B ...

  8. Ambari里如何删除某指定的服务(图文详解)

    不多说,直接干货! Ambari 借鉴了很多成熟分布式软件的 API 设计.Rest API 就是一个很好地体现.通过 Ambari 的 Rest API,可以在脚本中通过 curl 维护整个集群.并 ...

  9. 小白也能看懂插件化DroidPlugin原理(一)-- 动态代理

    前言:插件化在Android开发中的优点不言而喻,也有很多文章介绍插件化的优势,所以在此不再赘述.前一阵子在项目中用到 DroidPlugin 插件框架 ,近期准备投入生产环境时出现了一些小问题,所以 ...

  10. Memcached的基础梳理

    1 .Memcached 概念 官方解释如下: What is Memcached? Free & open source, high-performance, distributed mem ...