mirror of
https://github.com/yewstack/yew.git
synced 2025-12-08 21:26:25 +00:00
docs: fix admonitions in zh-CN translations (#1996)
This commit is contained in:
Campbell He
GitHub
parent
4d957ea0f0
commit
316dad2f6b
@ -9,7 +9,9 @@ description: 组件及其生命周期钩子
|
||||
|
||||
## 生命周期
|
||||
|
||||
:::note `为我们的文档做出贡献：`[添加组件的生命周期图示](https://github.com/yewstack/docs/issues/22) :::
|
||||
:::important contribute
|
||||
`为我们的文档做出贡献：`[添加组件的生命周期图示](https://github.com/yewstack/docs/issues/22)
|
||||
:::
|
||||
|
||||
## 生命周期方法
|
||||
|
||||
@ -88,7 +90,9 @@ impl Component for MyComponent {
|
||||
}
|
||||
```
|
||||
|
||||
:::tip note 请注意，可以不实现此生命周期方法，默认情况下不会执行任何操作。 :::
|
||||
:::tip note
|
||||
请注意，可以不实现此生命周期方法，默认情况下不会执行任何操作。
|
||||
:::
|
||||
|
||||
### Update
|
||||
|
||||
|
||||
@ -4,7 +4,9 @@ sidebar_label: 简介
|
||||
description: 介绍函数式组件
|
||||
---
|
||||
|
||||
:::warning 我们仍在研究函数式组件和 Hooks。它们还没有完全准备好使用。如果您想提供帮助，请查看[项目板](https://github.com/yewstack/yew/projects/3)以获取仍需要完成的事项列表。 :::
|
||||
:::warning
|
||||
我们仍在研究函数式组件和 Hooks。它们还没有完全准备好使用。如果您想提供帮助，请查看[项目板](https://github.com/yewstack/yew/projects/3)以获取仍需要完成的事项列表。
|
||||
:::
|
||||
|
||||
函数式组件是普通组件的简化版本。它们由一个接收 props 的函数组成，并通过返回`Html`来确定应该呈现什么。基本上，它是一个简化为`view`方法的组件。就其本身而言，这将是相当有限的，因为您只能创建纯组件，而这就是 Hook 大展身手的地方。Hook 允许函数组件无需实现`Component` trait，就可以使用状态（state）和其他 Yew 功能。
|
||||
|
||||
@ -40,4 +42,4 @@ Yew 带有以下预定义的钩子：
|
||||
|
||||
#### 自定义钩子（Custom Hooks）
|
||||
|
||||
在某些情况下，您出于一些原因想要定义自己的 Hook。 Yew 允许你这么做，即你可以使用Hooks从组件中提取潜在的带有状态的逻辑到可重用的函数中。更多有关信息，请参阅[定义自定义挂钩部分](function-components/custom-hooks.md#defining-custom-hooks)。
|
||||
在某些情况下，您出于一些原因想要定义自己的 Hook。 Yew 允许你这么做，即你可以使用 Hooks 从组件中提取潜在的带有状态的逻辑到可重用的函数中。更多有关信息，请参阅[定义自定义挂钩部分](function-components/custom-hooks.md#defining-custom-hooks)。
|
||||
|
||||
@ -12,7 +12,9 @@ description: 用于生成 HTML 和 SVG 的宏程序
|
||||
2. 空的 `html! {}` 宏调用是有效的但不会渲染任何内容
|
||||
3. 常量必须始终被引号括起来并被包含在大括号里：`html! { "Hello, World" }`
|
||||
|
||||
:::note `html!`宏可以轻松达到编译器的默认递归限制。如果遇到编译错误，建议增大其值。在根 crate 使用这样的属性`#![recursion_limit="1024"]` 处理这个问题。 :::
|
||||
:::note
|
||||
`html!`宏可以轻松达到编译器的默认递归限制。如果遇到编译错误，建议增大其值。在根 crate 使用这样的属性`#![recursion_limit="1024"]` 处理这个问题。
|
||||
:::
|
||||
|
||||
## 标签结构
|
||||
|
||||
@ -56,7 +58,9 @@ html! {
|
||||
|
||||
<!--END_DOCUSAURUS_CODE_TABS-->
|
||||
|
||||
:::tip 为方便起见，*通常*需要关闭标签的元素**可以**自行关闭。比如这样写`html! { <div class="placeholder" /> }`是有效的。 :::
|
||||
:::tip
|
||||
为方便起见，*通常*需要关闭标签的元素**可以**自行关闭。比如这样写`html! { <div class="placeholder" /> }`是有效的。
|
||||
:::
|
||||
|
||||
## Children
|
||||
|
||||
@ -111,12 +115,14 @@ html! {
|
||||
|
||||
## 特殊属性
|
||||
|
||||
有一些特殊的属性不会直接影响 DOM，而是充当 Yew 虚拟 DOM 的指令。目前，有这样两个特殊的props： `ref`和`key` 。
|
||||
有一些特殊的属性不会直接影响 DOM，而是充当 Yew 虚拟 DOM 的指令。目前，有这样两个特殊的 props： `ref`和`key` 。
|
||||
|
||||
`ref`允许您直接访问和操作底层 DOM 节点。见[参考文献](components/refs)获取的更多细节。
|
||||
|
||||
`key`为元素提供了一个唯一标识符，Yew 可以将其用于优化。
|
||||
|
||||
:::important 关于key的文档尚未编写。见[#1263](https://github.com/yewstack/yew/issues/1263) 。
|
||||
:::important
|
||||
关于 key 的文档尚未编写。见[#1263](https://github.com/yewstack/yew/issues/1263) 。
|
||||
|
||||
目前来说，当您有一个内部元素会发生位置变化的列表时，请使用key。比如在除了列表尾部的任何位置插入或删除元素。 :::
|
||||
目前来说，当您有一个内部元素会发生位置变化的列表时，请使用 key。比如在除了列表尾部的任何位置插入或删除元素。
|
||||
:::
|
||||
|
||||
@ -3,7 +3,7 @@ title: 路由（Router）
|
||||
description: Yew 的官方 Router
|
||||
---
|
||||
|
||||
[在crates.io上查看 router ](https://crates.io/crates/yew-router)
|
||||
[在 crates.io 上查看 router ](https://crates.io/crates/yew-router)
|
||||
|
||||
Routers 在单页应用（SPA）中根据 URL 的不同显示不同的页面。当点击一个链接时，Router 在本地设置 URL 以指向应用程序中有效的路由，而不是默认请求一个不同的远程资源。然后 Router 检测到此更改后决定要渲染的内容。
|
||||
|
||||
@ -53,7 +53,8 @@ enum AppRoute {
|
||||
}
|
||||
```
|
||||
|
||||
:::caution 请注意，通过为派生宏生成实现 `Switch`将按照从前到后的顺序为每个标注的路径进行匹配，所以当有路由符合多个`to` 注解的路径时，将会永远只会匹配第一个符合的路径。例如，如果您定义了以下`Switch`，将只会匹配到`AppRoute::Home`路由。
|
||||
:::caution
|
||||
请注意，通过为派生宏生成实现 `Switch`将按照从前到后的顺序为每个标注的路径进行匹配，所以当有路由符合多个`to` 注解的路径时，将会永远只会匹配第一个符合的路径。例如，如果您定义了以下`Switch`，将只会匹配到`AppRoute::Home`路由。
|
||||
|
||||
```rust
|
||||
#[derive(Switch)]
|
||||
|
||||
@ -4,4 +4,6 @@ sidebar_label: 概览
|
||||
description: Yew与浏览器API之间的粘合剂。
|
||||
---
|
||||
|
||||
:::note 本节仍在编写中。 :::
|
||||
:::note
|
||||
本节仍在编写中。
|
||||
:::
|
||||
|
||||
@ -2,4 +2,6 @@
|
||||
title: Format
|
||||
---
|
||||
|
||||
:::important contribute `为我们的文档做出贡献：`[深入解释格式模块](https://github.com/yewstack/docs/issues/24) :::
|
||||
:::important contribute
|
||||
`为我们的文档做出贡献：`[深入解释格式模块](https://github.com/yewstack/docs/issues/24)
|
||||
:::
|
||||
|
||||
@ -10,7 +10,9 @@ description: 为成功做好准备
|
||||
|
||||
此外，为了将 Rust 编译为 Wasm，您还需要安装`wasm32-unknown-unknown`。如果你使用的是 rustup，只需运行`rustup target add wasm32-unknown-unknown` 。
|
||||
|
||||
:::important Yew 支持的最低 Rust 版本 (MSRV) 是`1.49.0` 。旧版本可能会导致意外问题，并伴有难以理解的错误消息。你可以使用 `rustup show` （在“active toolchain”下）或 `rustc --version`检查您的工具链版本。要更新您的工具链，请运行`rustup update` 。 :::
|
||||
:::important
|
||||
Yew 支持的最低 Rust 版本 (MSRV) 是`1.49.0` 。旧版本可能会导致意外问题，并伴有难以理解的错误消息。你可以使用 `rustup show` （在“active toolchain”下）或 `rustc --version`检查您的工具链版本。要更新您的工具链，请运行`rustup update` 。
|
||||
:::
|
||||
|
||||
## **Wasm 构建工具**
|
||||
|
||||
@ -20,7 +22,7 @@ description: 为成功做好准备
|
||||
|
||||
一个实际是为了构建 Yew 应用程序的而制作的工具。它可以构建任何基于`wasm-bindgen`的应用程序，其设计灵感来自 rollup.js。使用 Trunk，您无需安装 Node.js 或接触任何 JavaScript 代码。它可以将资源（assets）绑定到的你的应用程序，甚至附带 Sass 编译器。
|
||||
|
||||
我们所有的示例都基于Trunk构建。
|
||||
我们所有的示例都基于 Trunk 构建。
|
||||
|
||||
[开始使用 `trunk`](project-setup/using-trunk.md)
|
||||
|
||||
|
||||
@ -4,7 +4,8 @@ title: 使用 wasm-pack
|
||||
|
||||
这个工具由 Rust / Wasm 工作组开发维护，并且是现在最为活跃的 WebAssembly 应用开发工具。 它支持将代码打包成 `npm` 模块，并且随附了 [Webpack 插件](https://github.com/wasm-tool/wasm-pack-plugin)，可以轻松的与已有的 JavaScript 应用结合。可以点击[这里](https://rustwasm.github.io/docs/wasm-pack/introduction.html)了解更多。
|
||||
|
||||
:::note 注：如果使用 `wasm-pack`作为开发工具，`Cargo.toml` 中的 `crate-type` 需要指定为 `cdylib`
|
||||
:::note
|
||||
注：如果使用 `wasm-pack`作为开发工具，`Cargo.toml` 中的 `crate-type` 需要指定为 `cdylib`
|
||||
|
||||
```toml
|
||||
[lib]
|
||||
@ -35,7 +36,7 @@ wasm-pack build --target web
|
||||
rollup ./main.js --format iife --file ./pkg/bundle.js
|
||||
```
|
||||
|
||||
当使用诸如rollup.js打包时，你可以省去 `--target web`。
|
||||
当使用诸如 rollup.js 打包时，你可以省去 `--target web`。
|
||||
|
||||
## 部署
|
||||
|
||||
|
||||
@ -5,9 +5,11 @@ description: Yew 框架规划功能的路线图
|
||||
|
||||
## 优先次序
|
||||
|
||||
由社区决定将来特性的开发优先度以及需要侧重的关注点。 在2020年春季，发起过开发者调查问卷，收集有关项目发展方向的反馈。您可以在[Yew Wiki](https://github.com/yewstack/yew/wiki/Dev-Survey-%5BSpring-2020%5D)中找到摘要。
|
||||
由社区决定将来特性的开发优先度以及需要侧重的关注点。 在 2020 年春季，发起过开发者调查问卷，收集有关项目发展方向的反馈。您可以在[Yew Wiki](https://github.com/yewstack/yew/wiki/Dev-Survey-%5BSpring-2020%5D)中找到摘要。
|
||||
|
||||
:::note 所有主要计划都可以在 Yew Github[项目板](https://github.com/yewstack/yew/projects) 中查看进展 :::
|
||||
:::note
|
||||
所有主要计划都可以在 Yew Github[项目板](https://github.com/yewstack/yew/projects) 中查看进展
|
||||
:::
|
||||
|
||||
## 关注点
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user