crm踩坑记(二)
Linux
tmux
如何查看
tmux如何进行滚动呢?
prefix + [, prefix为tmux的前置动作,默认是ctrl + b。- 使用方向键或者pageUp来进行翻页。
q可以退出滚动模式。- 支持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, 自己经常遇到这种情况,就直接慌了,因为感觉自己查不到错,其实很简单的。总结自己的两步:
- 先检查路径是否正确。
- 检查路径的单词是否拼错。
- 检查被引用的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的数据
代码习惯
- 表单提交时,可以将表单检测分为2个过程,
static error check以及post error check
crm踩坑记(二)的更多相关文章
- 【React踩坑记二】react项目实现JS路由跳转
这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...
- crm踩坑记(三)
React 如何同步更新state 由于setState方法是异步的,而通常很多时候在一个生命周期里更新state后需要在另一个生命周期里使用这个state. 下面介绍几个方法 // 1 this.s ...
- Visual Studio For MacOS 踩坑记(二)
Visual Studio For MacOS安装安卓SDK. 系统默认安装了安卓6.0 API23的SDK. 但是我需要安卓7.0的,API24. 遂安装. SDK可以下载成功,但是用Visu ...
- crm踩坑记(一)
目录 antd es6 Object.entries() Object.keys() Object.getOwnPropertyNames() 很神奇的用法!!! eslint 傻逼 其他 参考 an ...
- iOS自动化打包上传的踩坑记
http://www.cocoachina.com/ios/20160624/16811.html 很久以前就看了很多关于iOS自动打包ipa的文章, 看着感觉很简单, 但是因为一直没有AppleDe ...
- [技术博客] 敏捷软工——JavaScript踩坑记
[技术博客] 敏捷软工--JavaScript踩坑记 一.一个令人影响深刻的坑 1.脚本语言的面向对象 面向对象特性是现代编程语言的基本特性,JavaScript中当然集成了面向对象特性.但是Java ...
- Spark踩坑记——Spark Streaming+Kafka
[TOC] 前言 在WeTest舆情项目中,需要对每天千万级的游戏评论信息进行词频统计,在生产者一端,我们将数据按照每天的拉取时间存入了Kafka当中,而在消费者一端,我们利用了spark strea ...
- Spark踩坑记——数据库(Hbase+Mysql)
[TOC] 前言 在使用Spark Streaming的过程中对于计算产生结果的进行持久化时,我们往往需要操作数据库,去统计或者改变一些值.最近一个实时消费者处理任务,在使用spark streami ...
- 【踩坑记】从HybridApp到ReactNative
前言 随着移动互联网的兴起,Webapp开始大行其道.大概在15年下半年的时候我接触到了HybridApp.因为当时还没毕业嘛,所以并不清楚自己未来的方向,所以就投入了HybridApp的怀抱. Hy ...
随机推荐
- 带你重拾JavaScript(2)之console的你所不知道的功能
JavaScript最常用的调试工具就是console.info()了.console是浏览器中window对象的属性之一,由浏览器对象模型(BOM)提供,作用是访问浏览器控制台,你可以通过conso ...
- 推荐一个基于Vue2.0的的一款移动端开发的UI框架,特别好用。。。
一丶YDUI 一只注重审美,且性能高效的移动端&微信UI. 下面为地址自己研究去吧! 我的项目正在用,以前用的Mint-ui但是现在感觉还是这个好一点,官方给出的解释很清楚,很实用. 官方地址 ...
- web前段学习2017.6.13
CSS---表现层,修饰和表现html文档,为了解决结构层和表现层分离的问题. 通过CSS极大的提高了工作效率,方便工作人员维护和管理CSS:层叠样式表,目前用的最广泛的css版本为css2,最新版本 ...
- 使用matplotlib快速绘图
matplotlib的pyplot子库提供了和matlab类似的绘图API,方便用户快速绘制2D图表.让我们先来看一个简单的例子: # -*- coding: utf-8 -*- import num ...
- h5 新增的invalid事件,貌似有很大bug
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- 如何在AngularX 中 使用ngrx
ngrx 是 Angular框架的状态容器,提供可预测化的状态管理. 1.首先创建一个可路由访问的模块 这里命名为:DemopetModule. 包括文件:demopet.html.demopet.s ...
- tp框架---View视图层---模板继承(举例说明)
当我们做动态页面时,我们会发现一个网站的头部和尾部是相同的,那么我们如何用tp框架来做模板呢 ? 先看一下注意事项: (1)每个区块由<block></block>标签组成 ( ...
- Frameset框架集的应用
Frameset框架集常用于写网站后台页面,大多数"T字型"布局后台页面,就是应用Frameset框架集来做的.Franeset框架集的优点是,他可以在同浏览器窗口显示不同页面内容 ...
- python cookbook第三版学习笔记十:类和对象(一)
类和对象: 我们经常会对打印一个对象来得到对象的某些信息. class pair: def __init__(self,x,y): self.x=x self. ...
- CJOJ 1943 【重庆八中模拟赛】寻找代表元(二分图最大匹配)
CJOJ 1943 [重庆八中模拟赛]寻找代表元(二分图最大匹配) Description 八中一共有n个社团,分别用1到n编号. 八中一共有m个人,分别用1到m编号.每个人可以参加一个或多个社团,也 ...