TRY CODING FUN

重拾编程的乐趣

0%

发表于 更新于 分类于
本文字数： 304 阅读时长 ≈ 1 分钟

下载油管视频

1
2
3
4
5
6
7
8
9
10
11
12
13
# 直接下载
youtube-dl https://www.youtube.com/

youtube-dl -f 'bestvideo[ext=mp4]+bestaudio[ext=m4a]/mp4' https://www.youtube.com/

# 列出可下载格式
youtube-dl -F https://www.youtube.com/

# 选择格式进行下载
youtube-dl -f 18 https://www.youtube.com/

# 下载转换成MP3
youtube-dl -x --audio-format mp3 https://www.youtube.com/

发表于 更新于 分类于
本文字数： 295 阅读时长 ≈ 1 分钟

自己的网站总是被谷歌提示要翻译，猜到要设置语言

1
2
3
4
5
6
7
8
<!-- 中文 --><html lang="zh-Hans">

<!-- 简体中文 --><html lang="zh-cmn-Hans">

<!-- 繁体中文 --><html lang="zh-cmn-Hant">

<!-- English --><html lang="en">

具体参详知乎文章：

https://www.zhihu.com/question/20797118

发表于 更新于 分类于
本文字数： 1.1k 阅读时长 ≈ 1 分钟

问题

flex 自动换行有点问题

列数不固定，但是子元素宽度高度是固定的，最后几个元素很难居左（期望内容整体平均分布）

阅读全文 »

发表于 更新于 分类于
本文字数： 27 阅读时长 ≈ 1 分钟

查看浏览器信息

1
navigator.userAgent

发表于 更新于 分类于
本文字数： 620 阅读时长 ≈ 1 分钟

服务器端

一键配置，方便
https://github.com/MvsCode/frps-onekey

客户端

看文档配置即可

https://gofrp.org/docs/examples/vhost-http/

1
2
3
4
5
6
7
8
9
10
[common]
server_addr = xx.xx.xx.xx(外网ip)
server_port = 7000

[web]
type = http
local_ip = (内网服务器ip)
# 转发到nginx监听的端口
local_port = 80
custom_domains = xx.xx.xx.xx(外网ip，和server_addr的相同)

nginx 配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
server {
  listen       80;
  server_name  localhost;

  location / {
      root   html;
      index  index.html index.htm;
  }
  location ^~ /xxx(解析的路径){
      proxy_pass http://xxx.xxx.xx.xx/xxx(转发的内网地址);
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $http_host;
      proxy_redirect off;
  }

发表于 更新于 分类于
本文字数： 235 阅读时长 ≈ 1 分钟

项目里的 UIA库引用了另外一个UI库B的样式，这个UI库B样式有问题，需要替换。

在 package.json 里这么写即可

1
2
3
4
5
6
{
  "name": "baz",
  "dependencies": {
    "bar": "file:../foo/bar"
  }
}

或者 yarn 安装的时候写好路径

1
yarn add file:./../your-project

发表于 更新于 分类于
本文字数： 1.1k 阅读时长 ≈ 1 分钟

Element-UI 抽屉组件 Drawer 有个 BUG

就是在抽屉内容区选中文字，然后不松手，然后移动鼠标到弹窗外，却触发了隐藏逻辑。

正确的交互应该是：选中文字不松手，鼠标移动到弹窗外不触发隐藏逻辑，平时点击弹窗外可以触发隐藏逻辑。

设置一下 :wrapper-closable="false"

1
2
3
4
5
6
7
8
9
10
11
12
<el-drawer
  v-bind="$attrs"
  class="translation"
  :with-header="false"
  size="450px"
  :wrapper-closable="false"
  v-on="$listeners"
  @mousedown.native="handleWrapperMousedown"
  @mouseup.native="handleWrapperMouseup"
>
  我被选中拉
</el-drawer>

重点是鼠标按下 @mousedown.native="handleWrapperMousedown" 鼠标弹起 @mouseup.native="handleWrapperMouseup" 这两个逻辑

1
2
3
4
5
6
7
8
9
10
11
12
handleWrapperMousedown (e) {
  this.classmodel = !!e.target.classList.contains('el-drawer__container')
},
handleWrapperMouseup (e) {
  if ((!!e.target.classList.contains('el-drawer__container')) && this.classmodel) {
    console.log(`editdrawer`, false)
    this.$emit('update:visible', false)
  } else {
    console.log(`editdrawer`, true)
  }
  this.classmodel = false
}

转载

发表于 更新于 分类于
本文字数： 143 阅读时长 ≈ 1 分钟

父组件

1
<text-document v-bind:title.sync="title"></text-document>

子组件可以用这个修改 title

1
this.$emit('update:title', newTitle)