mirror of
https://github.com/jaywcjlove/reference.git
synced 2025-06-17 04:31:22 +08:00
Compare commits
6 Commits
Author | SHA1 | Date | |
---|---|---|---|
026dc585a8 | |||
d09737fcda | |||
029e2751c4 | |||
0a4bd03900 | |||
fe7782a0c4 | |||
9751df06b9 |
@ -27,7 +27,7 @@ Quick Reference
|
||||
[Flutter](./docs/flutter.md)<!--rehype:style=background: rgb(150 220 254);&class=contributing tag&data-lang=Dart-->
|
||||
[Gitlab CI/CD](./docs/gitlab-ci.md)<!--rehype:style=background: rgb(226 67 41);&class=contributing-->
|
||||
[LaTeX](./docs/latex.md)<!--rehype:style=background: rgb(0 128 128);&class=contributing-->
|
||||
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128);-->
|
||||
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128);&class=contributing-->
|
||||
[NestJS](./docs/nestjs.md)<!--rehype:style=background: rgb(237 21 67);&class=contributing-->
|
||||
[MATLAB](./docs/matlab.md)<!--rehype:style=background: rgb(0 118 168);&class=contributing-->
|
||||
[Oracle](./docs/oracle.md)<!--rehype:style=background: rgb(255 0 0);&class=contributing tag&data-lang=SQL-->
|
||||
@ -84,6 +84,7 @@ Quick Reference
|
||||
[HTML](./docs/html.md)<!--rehype:style=background: rgb(228 77 39);-->
|
||||
[JavaScript](./docs/javascript.md)<!--rehype:style=background: rgb(203 183 31);-->
|
||||
[Less.js](./docs/lessjs.md)<!--rehype:style=background: rgb(29 54 93);&class=tag&data-lang=CSS-->
|
||||
[Next.js](./docs/nextjs.md)<!--rehype:style=background: rgb(0 0 0);&class=tag&data-lang=React-->
|
||||
[React](./docs/react.md)<!--rehype:style=background: rgb(34 143 173);-->
|
||||
[RegEx 正则表达式](./docs/regex.md)<!--rehype:style=background: rgb(149 36 155);-->
|
||||
[TypeScript](./docs/typescript.md)<!--rehype:style=background: rgb(49 120 198);-->
|
||||
|
3
assets/nextjs.svg
Normal file
3
assets/nextjs.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" height="1em" width="1em">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 7.5a7.5 7.5 0 1 1 11.697 6.216L4.907 4.21A.5.5 0 0 0 4 4.5V12h1V6.06l5.83 8.162A7.5 7.5 0 0 1 0 7.5ZM10 10V4h1v6h-1Z" fill="currentColor"/>
|
||||
</svg>
|
After Width: | Height: | Size: 299 B |
140
docs/flutter.md
140
docs/flutter.md
@ -421,8 +421,6 @@ SizedBox(
|
||||
在实际开发中,Container常常用于对一个组件进行包装修饰。
|
||||
|
||||
```dart
|
||||
// 将Contianer大小固定为100 * 100, 背景色为蓝色。
|
||||
// 把Text包裹在Container中,并将其居中
|
||||
Container(
|
||||
width: 100,
|
||||
height: 100,
|
||||
@ -430,9 +428,10 @@ Container(
|
||||
alignment: Alignment.center,
|
||||
child: Text('Hello world'),
|
||||
),
|
||||
|
||||
```
|
||||
|
||||
将 `Contianer` 大小固定为 `100 * 100`, 背景色为蓝色。把 `Text` 包裹在 `Container` 中,并将其居中
|
||||
|
||||
### Column
|
||||
|
||||
列布局(Column),可以将多个子组件沿着垂直的方向摆放(竖的摆放)
|
||||
@ -461,7 +460,6 @@ Column(
|
||||
行布局(Row),可以将多个组件沿水平的方向摆放。
|
||||
|
||||
```dart
|
||||
// 在同一行摆放3个Button
|
||||
Row(
|
||||
children: [
|
||||
ElevatedButton(
|
||||
@ -480,12 +478,13 @@ Row(
|
||||
),
|
||||
```
|
||||
|
||||
在同一行摆放 3 个 `Button`
|
||||
|
||||
### Wrap
|
||||
|
||||
将子组件从左到右依次排列,当空间不足时自动换行。
|
||||
|
||||
```dart
|
||||
// 显示多个Flutter 的logo并自动换行
|
||||
Wrap(
|
||||
children: [
|
||||
FlutterLogo(),
|
||||
@ -498,14 +497,14 @@ Wrap(
|
||||
),
|
||||
```
|
||||
|
||||
显示多个 `Flutter` 的 `logo` 并自动换行
|
||||
|
||||
### Stack
|
||||
|
||||
Stack 可以将一多个子组件叠在一起显示。堆叠顺序按照children属性中的列表依次堆叠摆放,默认将子控件沿左上角对齐。
|
||||
需要控制子控件位置可以嵌套`Positoned`控件。
|
||||
|
||||
```dart
|
||||
// 依次堆叠300*300的蓝色色块、200*200的黑色色块、
|
||||
// 100*100的黄色色块
|
||||
Stack(
|
||||
children: [
|
||||
Container(
|
||||
@ -527,6 +526,8 @@ Stack(
|
||||
),
|
||||
```
|
||||
|
||||
依次堆叠 `300*300` 的蓝色色块、`200*200` 的黑色色块、`100*100` 的黄色色块
|
||||
|
||||
### Positioned
|
||||
<!--rehype:wrap-class=row-span-2-->
|
||||
若需要控制Stack中子控件的位置,则可以嵌套改控件。
|
||||
@ -603,6 +604,131 @@ Container(
|
||||
),
|
||||
```
|
||||
|
||||
### Flex
|
||||
|
||||
Flex 的用法与 `Row` 或 `Column` 类似,但只需要额外传入 `direction` 参数
|
||||
|
||||
- `Row` 和 `Column` 组件都继承 `Flex` 组件
|
||||
- 设置 `direction` 为 `Axis.horizontal` 表示水平方向(`Row`),为 `Axis.vertical`则为垂直方向(`Column`)
|
||||
|
||||
垂直方向依次摆放3个flutter logo
|
||||
|
||||
```dart
|
||||
Flex(
|
||||
direction: Axis.vertiacl,
|
||||
children;[
|
||||
Fluterlogo(),
|
||||
Fluterlogo(),
|
||||
Fluterlogo(),
|
||||
],
|
||||
),
|
||||
```
|
||||
|
||||
水平方向依次摆放 3 个 flutter logo
|
||||
|
||||
```dart
|
||||
Flex(
|
||||
dirction: Axis.horizontal,
|
||||
children: [
|
||||
Flutterlogo(),
|
||||
Flutterlogo(),
|
||||
Flutterlogo(),
|
||||
],
|
||||
),
|
||||
```
|
||||
|
||||
### Expaneded
|
||||
<!--rehype:wrap-class=row-span-2-->
|
||||
|
||||
Expanded 用于扩张一个子组件。可以通过 `flex` 属性,用于表示该组件相对其他弹性组件放大的倍数(可以理解为一个权重)。
|
||||
|
||||
```dart
|
||||
// Container 会占满剩余的全部空用空间
|
||||
Row(
|
||||
children: [
|
||||
FlutterLogo(),
|
||||
Expanded(
|
||||
child: Container(
|
||||
child: FlutterLogo(),
|
||||
color: Colors.green,
|
||||
),
|
||||
),
|
||||
FlutterLogo(),
|
||||
],
|
||||
),
|
||||
|
||||
// 按照1:2 的比例分配一整行的空间
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 1,
|
||||
child: Container(
|
||||
child: FlutterLogo(),
|
||||
color: Colors.green,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: Container(
|
||||
child: FlutterLogo(),
|
||||
color: Colors.blue,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
```
|
||||
|
||||
### Flexible
|
||||
<!--rehype:wrap-class=row-span-2-->
|
||||
|
||||
`Flexible` 是 `Expanded` 组件的父类。
|
||||
与 `Expanded` 不同的是,`Flexible` 可以通过 `fit` 属性设置子控件是否必须占满 `Flexibal` 扩展的空间。而 `Expaned` 默认子控件必须占满
|
||||
|
||||
```dart
|
||||
// 如果将fit设置为tight,
|
||||
// 则绿色Container 和蓝色Container大小一样。
|
||||
// 如果将fit设置为loose,
|
||||
// 则两个Flexible扩展的空间大小是一样的,
|
||||
// 但绿色Container并不会填充整个扩展的空间。
|
||||
Row(
|
||||
children: [
|
||||
Flexible(
|
||||
flex: 2,
|
||||
// fit: FlexFit.tight,
|
||||
child: Container(
|
||||
child: FlutterLogo(),
|
||||
color: Colors.green,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: Container(
|
||||
child: FlutterLogo(),
|
||||
color: Colors.blue,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
```
|
||||
|
||||
将 `Flexible` 的 `fit` 属性设置为 `tingt`,就等价于使用 `Expanded`
|
||||
|
||||
### Spacer
|
||||
|
||||
Spacer 用于在布局中留白
|
||||
|
||||
```dart
|
||||
Row(
|
||||
children: [
|
||||
Text('Item'),
|
||||
Spacer(),
|
||||
FlutterLogo(),
|
||||
],
|
||||
),
|
||||
```
|
||||
|
||||
例如,需要文本和图标位于一个行的两端,而中间留白时。就可以使用 `Spacer`
|
||||
|
||||
另见
|
||||
---
|
||||
|
||||
|
@ -924,8 +924,273 @@ steps:
|
||||
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
|
||||
```
|
||||
|
||||
当 `npm` 推送包失败不影响整个流程,可用于自动发包
|
||||
|
||||
GitLab CI/CD 迁移到 GitHub Actions
|
||||
---
|
||||
|
||||
### 语法示例
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
job1:
|
||||
variables:
|
||||
GIT_CHECKOUT: "true"
|
||||
script:
|
||||
- echo "Run your script here"
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
job1:
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
- run: echo "Run your script here"
|
||||
```
|
||||
|
||||
### 运行程序
|
||||
<!--rehype:wrap-class=row-span-2-->
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
windows_job:
|
||||
tags:
|
||||
- windows
|
||||
script:
|
||||
- echo Hello, %USERNAME%!
|
||||
|
||||
linux_job: tags:
|
||||
- linux script:
|
||||
- echo "Hello, $USER!"
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
windows_job:
|
||||
runs-on: windows-latest
|
||||
steps:
|
||||
- run: echo Hello, %USERNAME%!
|
||||
|
||||
linux_job:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- run: echo "Hello, $USER!"
|
||||
```
|
||||
|
||||
在不同的平台上运行作业
|
||||
|
||||
### Docker 映像
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
my_job:
|
||||
image: node:10.16-jessie
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
my_job:
|
||||
container: node:10.16-jessie
|
||||
```
|
||||
|
||||
### 条件和表达式语法
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
deploy_prod:
|
||||
stage: deploy
|
||||
script:
|
||||
- echo "部署到生产服务器"
|
||||
rules:
|
||||
- if: '$CI_COMMIT_BRANCH == "master"'
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
deploy_prod:
|
||||
if: contains( github.ref, 'master')
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- run: echo "部署到生产服务器"
|
||||
```
|
||||
|
||||
### Artifacts
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
script:
|
||||
artifacts:
|
||||
paths:
|
||||
- math-homework.txt
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
- name: Upload math result for job 1
|
||||
uses: actions/upload-artifact@v3
|
||||
with:
|
||||
name: homework
|
||||
path: math-homework.txt
|
||||
```
|
||||
|
||||
### 作业之间的依赖关系
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
stages:
|
||||
- build
|
||||
- test
|
||||
- deploy
|
||||
|
||||
build_a: stage: build script:
|
||||
- echo "该作业将首先运行"
|
||||
|
||||
build_b: stage: build script:
|
||||
- echo "该作业将首先运行,与 build_a 并行"
|
||||
|
||||
test_ab: stage: test script:
|
||||
- echo "此作业将在 build_a 和 build_b 完成后运行"
|
||||
|
||||
deploy_ab: stage: deploy script:
|
||||
- echo "此作业将在 test_ab 完成后运行"
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
build_a:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- run: echo "该作业将首先运行"
|
||||
|
||||
build_b:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- run: echo "该作业将首先运行,与 build_a 并行"
|
||||
|
||||
test_ab:
|
||||
runs-on: ubuntu-latest
|
||||
needs: [build_a,build_b]
|
||||
steps:
|
||||
- run: echo "此作业将在 build_a 和 build_b 完成后运行"
|
||||
|
||||
deploy_ab:
|
||||
runs-on: ubuntu-latest
|
||||
needs: [test_ab]
|
||||
steps:
|
||||
- run: echo "此作业将在 test_ab 完成后运行"
|
||||
```
|
||||
|
||||
### 缓存
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
image: node:latest
|
||||
|
||||
cache: key: $CI_COMMIT_REF_SLUG paths:
|
||||
- .npm/
|
||||
|
||||
before_script:
|
||||
- npm ci --cache .npm --prefer-offline
|
||||
|
||||
test_async: script:
|
||||
- node ./specs/start.js ./specs/async.spec.js
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
test_async:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Cache node modules
|
||||
uses: actions/cache@v3
|
||||
with:
|
||||
path: ~/.npm
|
||||
key: v1-npm-deps-${{ hashFiles('**/package-lock.json') }}
|
||||
restore-keys: v1-npm-deps-
|
||||
```
|
||||
|
||||
### 数据库和服务容器
|
||||
|
||||
<yel>GitLab CI/CD</yel>
|
||||
|
||||
```yml
|
||||
container-job:
|
||||
variables:
|
||||
POSTGRES_PASSWORD: postgres
|
||||
# PostgreSQL 服务容器通信的主机名
|
||||
POSTGRES_HOST: postgres
|
||||
# 默认的 PostgreSQL 端口
|
||||
POSTGRES_PORT: 5432
|
||||
image: node:10.18-jessie
|
||||
services:
|
||||
- postgres
|
||||
script:
|
||||
# 执行 package.json 文件中
|
||||
# 所有依赖项的全新安装
|
||||
- npm ci
|
||||
# 运行创建 PostgreSQL 客户端的脚本,
|
||||
# 用数据填充客户端,并检索数据
|
||||
- node client.js
|
||||
tags:
|
||||
- docker
|
||||
```
|
||||
|
||||
GitHub Actions
|
||||
|
||||
```yml
|
||||
jobs:
|
||||
container-job:
|
||||
runs-on: ubuntu-latest
|
||||
container: node:10.18-jessie
|
||||
|
||||
services:
|
||||
postgres:
|
||||
image: postgres
|
||||
env:
|
||||
POSTGRES_PASSWORD: postgres
|
||||
|
||||
steps:
|
||||
- name: Check out repository code
|
||||
uses: actions/checkout@v3
|
||||
|
||||
# 执行 package.json 文件中
|
||||
# 所有依赖项的全新安装
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Connect to PostgreSQL
|
||||
# 运行创建 PostgreSQL 客户端的脚本,
|
||||
# 用数据填充客户端,并检索数据
|
||||
run: node client.js
|
||||
env:
|
||||
# PostgreSQL 服务容器通信的主机名
|
||||
POSTGRES_HOST: postgres
|
||||
# 默认的 PostgreSQL 端口
|
||||
POSTGRES_PORT: 5432
|
||||
```
|
||||
|
||||
另见
|
||||
---
|
||||
|
||||
- [Github Actions 学习笔记](https://jaywcjlove.github.io/github-actions) _(jaywcjlove.github.io)_
|
||||
- [了解 GitHub Actions](https://docs.github.com/cn/actions/learn-github-actions) _(docs.github.com)_
|
||||
- [从 GitLab CI/CD 迁移到 GitHub Actions](https://docs.github.com/cn/actions/migrating-to-github-actions/migrating-from-gitlab-cicd-to-github-actions) _(docs.github.com)_
|
||||
|
1585
docs/nextjs.md
Normal file
1585
docs/nextjs.md
Normal file
File diff suppressed because it is too large
Load Diff
13
docs/rust.md
13
docs/rust.md
@ -853,12 +853,25 @@ let (x, _, y) = (1, 2, 3);
|
||||
println!("{x},{y}");
|
||||
```
|
||||
|
||||
----
|
||||
|
||||
```rust
|
||||
fn get_count_item(s: &str) -> (&str, &str) {
|
||||
let mut it = s.split(' ');
|
||||
let (Some(str1),Some(str2)) = (it.next(),it.next()) else {
|
||||
panic!("Can't segment count item pair");
|
||||
};
|
||||
(str1, str2)
|
||||
}
|
||||
```
|
||||
|
||||
### 函数中的模式匹配
|
||||
|
||||
```rust
|
||||
fn add((x, y): (i32, i32)) -> i32 {
|
||||
x + y
|
||||
}
|
||||
|
||||
fn main(){
|
||||
let sum = add(1, 2);
|
||||
println!("{sum}");
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@wcj/reference",
|
||||
"version": "1.27.0",
|
||||
"version": "1.28.0",
|
||||
"description": "为开发人员分享快速参考备忘单(主要是方便自己)。",
|
||||
"author": "jaywcjlove",
|
||||
"license": "MIT",
|
||||
|
Reference in New Issue
Block a user