发表于 | 更新于 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
import Popup from '@/components'

export default () => {
  const [show, setShow] = useState(false);
  const openPopup = () => {
    setShow(true);
  };
  return (
    <div className="App">
      <div>
        <Popup onClose={() => setShow(false)} show={show}>
          <div>
            <p>这里是 Popup 的内容</p>
            <p>这里是 Popup 的内容</p>
            <p>这里是 Popup 的内容</p>
            <p>这里是 Popup 的内容</p>
          </div>
        </Popup>
      </div>
    </div>
  );
}

发表于

预期的 Checkbox 使用方法



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import Checkbox from '@/components'
const { CheckboxItem } = Checkbox

export default () => {
  const onChange = (values) => {
    console.log(values)
  }
  return (
    <Checkbox onChange={onChange}>
      <CheckboxItem label="angular" />
      <CheckboxItem label="react" />
      <CheckboxItem label="vue" />
    </Checkbox>
  )
}


两种实现方式

通过 React.cloneElement

1
2
3
4
5
React.cloneElement(
  element,
  [props],
  [...children]
)
阅读全文 »

发表于 | 更新于

参考 Promises/A+, 实现一个Promise

定义状态

1
2
3
4
// define three states
const PENDING = 0
const RESOLVED = 1
const REJECTED = 2

version#0 (resolve/reject时变更状态)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
class MyPromise {
  constructor(executor) {
    const resolve = () => {
      this.state = RESOLVED
    }
    const reject = () => {
      this.state = REJECTED
    }
    
    this.state = PENDING
    try {
      executor(resolve, reject)
    } catch (error) {
      reject(error)
    }
  }
}
阅读全文 »

发表于

遇到的问题

最近在做一个论坛功能，发帖和评论输入都需要保存到数据库。
而测试测了emoji保存是有问题的，查了数据库是没存进去，google查了一下，emoji是4个字节的，需要将
MySql数据库字符集改由utf8改为utf8mb4，于是把找到的帖子给DBA，DBA看了说不能改，可能会影响现有的数据。

那就只好自己动手，丰衣足食了。
（如果下面的emoji没有正常展示请使用最新版的火狐浏览器）

emoji 存储及展示 前端解决思路

既然直接存储emoji有问题，就改为存储emoji的转换结果。
于是沿着这个思路，首先想到的是 charCodeAt/fromCharCode

阅读全文 »

发表于 | 更新于

winodws 下载 docker

如果电脑满足以下条件可以直接下载 docker desktop：

系统要求

  • Windows 10 64-bit: Pro, Enterprise, or Education (Build 15063 or later).
  • Hyper-V and Containers Windows features must be enabled.
  • 64 bit processor with Second Level Address Translation (SLAT)
  • 4GB system RAM
  • BIOS-level hardware virtualization support must be enabled in the BIOS settings

下载安装地址

docker-for-windows

docker Toolbox 安装

如果不满足上述条件则需要通过下载 Toolbox 来安装
Toobox 下载地址
下载最新版本的 .exe进行安装

阅读全文 »

发表于 | 更新于

Go下载

Go下载地址：https://golang.google.cn/dl/

vscode 配置 go 插件

在vscode EXRENSION 商店 搜索 go，第一个就是微软官方提供的go插件，装上它就可以愉快的撸 Go 啦!
或者新建一个 .go 文件，vscode 也会推荐安装相关的插件！

阅读全文 »

发表于 | 更新于

解决移动端 1px 边框问题

主要思路是将 HTML元素border设置为0，再通过伪类::before 或 ::after 去放大、旋转实现。
我的习惯是将 scss 变量存放在 vars.scss; scss mixin 存放在 mixin.scss.

vars.scss

1
2
3
4
$border-colors: (
  'main': #dddddd,
  'active': #0088ff,
);
阅读全文 »

发表于 | 更新于

在一个 shell 脚本中执行另一个 shell 脚本的3种方法

1
2
3
./bar.sh fork
./bar.sh exec
./bar.sh source

编辑启动脚本 /etc/init.d/autorun.sh

脚本前三行如下：

1
2
3
#!/bin/sh
#chkconfig: 2345 80 90
#description:auto_run

阅读全文 »

发表于 | 更新于

服务器安装 jenkins 持续集成，jenkins 常常会挂掉，那么就需要想办法让jenkins 在挂掉后自动重启。
本文采用 shell脚本 + crontab 来定时检测 jenkins 运行状态，如果挂掉了就重启

先了解一些预备知识

linux 清空文件内容的方法

1
2
3
4
5
$ : > filename 
$ > filename 
$ echo "" > filename 
$ echo > filename 
$ cat /dev/null > filename

linux 判断文件行数的方法

1
2
$ cat test1.sh |wc -l
$ wc -l test1.sh

Linux crontab命令

阅读全文 »