Skip to content

各种小技巧

readonly form

后台系统里 "查看" 要使用 “编辑” 表单组件 需要 disabled 所有表单项

  • 方案一:父标签 pointer-events: none 屏蔽自己以及后代所有鼠标事件
    • IE9 不支持。键盘 Tab 仍然可以访问
  • 方案二:使用浮层盖住
    • 键盘 Tab 仍然可以访问
  • 方案三:fieldset 标签的 disabled 属性
    • IE 只支持了 UI 样式“禁用” 和 键盘 Tab 访问,表单输入提交等事件仍可以触发
html
<form>
  <fieldset disabled>
    <!-- ... -->
  </fieldset>
</form>

综上 IE9+ 方案: 用 fieldset 包住表单项,然后盖个浮层上去


scss 与 js 共享变量

variables.scss 里定义了 scss 变量

scss
// 给 scss 用
$myColor: #f22148;

// 给 js 用
:export {
  myColor: $myColor;
}

index.scss 里使用

scss
@import './variables.scss';

#app {
  color: $myColor;
}

在 js 里使用

js
import styles from '@/assets/style/variables.scss'

console.log(styles.myColor) // '#f22148'

node 终端交互

npm i qoa yargs -D

js
const qoa = require('qoa') // 终端输入提示

const qoaList = [
  {
    type: 'interactive', // 单选
    query: '请选择:',
    symbol: '->',
    handle: 'local', // 参数名
    menu: ['option-1', 'option-2'],
  },
  {
    type: 'input', // 输入
    query: 'message:',
    handle: 'msg',
  },
]

qoa.prompt(qoaList).then(({ local, msg }) => {
  console.log(local, msg)
})
js
const argv = require('yargs').argv // 命令行参数解析
// $ ./plunder.js --ships 12 --distance 98.7
// argv -> { ships: '12', distance: '98.7' }

正则速查


cors 请求 前端没有携带 cookies

js
// 前端
export const http = axios.create({
  baseURL: 'api/',
  timeout: 20000,
  withCredentials: true // 带证 cookies
})

// 后端 yarn add kcors --dev
cors: {
  origin: 'http://localhost:8080', // Access-Control-Allow-Origin: http://localhost:8080
  credentials: true // Access-Control-Allow-Credentials: true
},

使用 choco 安装软件包

shell
# cmd 管理员身份

@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"

# powershell
Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

choco -v
shell
# 搜索关键词
choco search golang

# -y 安装过程中不需要等待确认
choco install golang -y

# 卸载
choco uninstall golang

# 升级
choco upgrade golang

# 已安装的
choco list -lo