dnrops
/
yew
mirror of https://github.com/yewstack/yew
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update to Docusaurus v3 (#3518) 

* prep

* update deps

* builds??

* fix deps

* switch back to Algolia search

#2253 switched to local search but that doesn't work with Docusaurus v3. Switch back to Algolia search

* fix mdx build issues

* fmt:write

* write translations

* use docusaurus preset

* contextualSearch & fmt

* npm run write-translations
This commit is contained in:
Muhammad Hamza 2023-11-05 17:27:39 +05:00 committed by GitHub
parent 915000572c
commit 00a6183bd2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
52 changed files with 7317 additions and 4079 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/workflows/build-website.yml vendored
View File

@ -25,7 +25,7 @@ jobs:
- name: Setup node - name: Setup node
uses: actions/setup-node@v4 uses: actions/setup-node@v4
with: with:
node-version: "16" node-version: "18"
- name: Install dependencies - name: Install dependencies
run: | run: |

2
website/docs/getting-started/build-a-sample-app.mdx
View File

@ -115,7 +115,7 @@ fn main() {
Finally, add an `index.html` file in the root directory of your app. Finally, add an `index.html` file in the root directory of your app.
```html , title=index.html ```html , title=index.html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/docs/getting-started/examples.mdx
View File

@ -9,7 +9,7 @@ We also welcome Pull Requests and issues for when they inevitably get neglected
For more details including a list of examples, refer to the [README]. For more details including a list of examples, refer to the [README].
:::note :::note
Most of the examples have a live deployment that can be found at https://examples.yew.rs/<example_name>. Most of the examples have a live deployment that can be found at https://examples.yew.rs/< example_name >.
Click the shield on their README page in their respective sub-folder to navigate to the live demo. Click the shield on their README page in their respective sub-folder to navigate to the live demo.
::: :::

2
website/docs/tutorial/index.mdx
View File

@ -105,7 +105,7 @@ fn main() {
Now, let's create an `index.html` at the root of the project. Now, let's create an `index.html` at the root of the project.
```html title="index.html" ```html title="index.html"
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head></head> <head></head>
<body></body> <body></body>

67
website/docusaurus.config.js
View File

@ -119,33 +119,47 @@ module.exports = {
prism: { prism: {
additionalLanguages: ['rust', 'toml'], additionalLanguages: ['rust', 'toml'],
}, },
gtag: { algolia: {
trackingID: 'G-DENCL8P4YP', appId: 'F8S2ICRD2T',
anonymizeIP: true, apiKey: '2dc337d68f84389c3713a393aff39816',
indexName: 'yew-rs',
contextualSearch: true,
insights: true, // Optional, automatically send insights when user interacts with search results
searchPagePath: 'search',
}, },
}, },
i18n: { i18n: {
defaultLocale: 'en', defaultLocale: 'en',
locales: ['en', 'ja', 'zh-Hans', 'zh-Hant'], locales: ['en', 'ja', 'zh-Hans', 'zh-Hant'],
}, },
presets: [
[
'@docusaurus/preset-classic',
{
theme: {
customCss: ['./src/css/custom.css'],
},
docs: {
path: 'docs',
sidebarPath: require.resolve('./sidebars/docs.js'),
editUrl,
routeBasePath: '/docs',
},
blog: {
path: 'blog',
blogTitle: 'Yew Blog',
editUrl,
},
pages: {},
gtag: {
trackingID: 'G-DENCL8P4YP',
anonymizeIP: true,
},
},
],
],
plugins: [ plugins: [
'content-pages',
'docusaurus-plugin-sass', 'docusaurus-plugin-sass',
[
'@docusaurus/theme-classic',
{
customCss: require.resolve('./src/css/custom.css'),
},
],
[
'@docusaurus/plugin-content-docs',
{
path: 'docs',
sidebarPath: require.resolve('./sidebars/docs.js'),
editUrl,
routeBasePath: '/docs',
},
],
[ [
'@docusaurus/plugin-content-docs', '@docusaurus/plugin-content-docs',
{ {
@ -156,14 +170,6 @@ module.exports = {
editUrl, editUrl,
}, },
], ],
[
'@docusaurus/plugin-content-blog',
{
path: 'blog',
blogTitle: 'Yew Blog',
editUrl,
},
],
[ [
'client-redirects', 'client-redirects',
{ {
@ -177,12 +183,5 @@ module.exports = {
], ],
}, },
], ],
[
'@easyops-cn/docusaurus-search-local',
{
hashed: true,
indexBlog: false,
},
],
], ],
} }

128
website/i18n/ja/code.json
View File

@ -295,5 +295,133 @@
"theme.docs.sidebar.toggleSidebarButtonAriaLabel": { "theme.docs.sidebar.toggleSidebarButtonAriaLabel": {
"message": "Toggle navigation bar", "message": "Toggle navigation bar",
"description": "The ARIA label for hamburger menu button of mobile navigation" "description": "The ARIA label for hamburger menu button of mobile navigation"
},
"theme.admonition.warning": {
"message": "警告",
"description": "The default label used for the Warning admonition (:::warning)"
},
"theme.DocSidebarItem.expandCategoryAriaLabel": {
"message": "Expand sidebar category '{label}'",
"description": "The ARIA label to expand the sidebar category"
},
"theme.DocSidebarItem.collapseCategoryAriaLabel": {
"message": "Collapse sidebar category '{label}'",
"description": "The ARIA label to collapse the sidebar category"
},
"theme.unlistedContent.title": {
"message": "Unlisted page",
"description": "The unlisted content banner title"
},
"theme.unlistedContent.message": {
"message": "This page is unlisted. Search engines will not index it, and only users having a direct link can access it.",
"description": "The unlisted content banner message"
},
"theme.SearchPage.inputPlaceholder": {
"message": "検索するキーワードを入力してください",
"description": "The placeholder for search page input"
},
"theme.SearchPage.inputLabel": {
"message": "検索",
"description": "The ARIA label for search page input"
},
"theme.SearchPage.algoliaLabel": {
"message": "Algoliaで検索",
"description": "The ARIA label for Algolia mention"
},
"theme.SearchPage.fetchingNewResults": {
"message": "新しい検索結果を取得しています...",
"description": "The paragraph for fetching new search results"
},
"theme.SearchModal.searchBox.resetButtonTitle": {
"message": "クリア",
"description": "The label and ARIA label for search box reset button"
},
"theme.SearchModal.searchBox.cancelButtonText": {
"message": "キャンセル",
"description": "The label and ARIA label for search box cancel button"
},
"theme.SearchModal.startScreen.recentSearchesTitle": {
"message": "最近の検索",
"description": "The title for recent searches"
},
"theme.SearchModal.startScreen.noRecentSearchesText": {
"message": "最近の検索履歴はありません",
"description": "The text when no recent searches"
},
"theme.SearchModal.startScreen.saveRecentSearchButtonTitle": {
"message": "この検索をお気に入りに追加",
"description": "The label for save recent search button"
},
"theme.SearchModal.startScreen.removeRecentSearchButtonTitle": {
"message": "この検索を履歴から削除",
"description": "The label for remove recent search button"
},
"theme.SearchModal.startScreen.favoriteSearchesTitle": {
"message": "お気に入り",
"description": "The title for favorite searches"
},
"theme.SearchModal.startScreen.removeFavoriteSearchButtonTitle": {
"message": "この検索をお気に入りから削除",
"description": "The label for remove favorite search button"
},
"theme.SearchModal.errorScreen.titleText": {
"message": "検索結果の取得に失敗しました",
"description": "The title for error screen of search modal"
},
"theme.SearchModal.errorScreen.helpText": {
"message": "ネットワーク接続を確認してください",
"description": "The help text for error screen of search modal"
},
"theme.SearchModal.footer.selectText": {
"message": "選ぶ",
"description": "The explanatory text of the action for the enter key"
},
"theme.SearchModal.footer.selectKeyAriaLabel": {
"message": "エンターキー",
"description": "The ARIA label for the Enter key button that makes the selection"
},
"theme.SearchModal.footer.navigateText": {
"message": "移動",
"description": "The explanatory text of the action for the Arrow up and Arrow down key"
},
"theme.SearchModal.footer.navigateUpKeyAriaLabel": {
"message": "上矢印キー",
"description": "The ARIA label for the Arrow up key button that makes the navigation"
},
"theme.SearchModal.footer.navigateDownKeyAriaLabel": {
"message": "下矢印キー",
"description": "The ARIA label for the Arrow down key button that makes the navigation"
},
"theme.SearchModal.footer.closeText": {
"message": "閉じる",
"description": "The explanatory text of the action for Escape key"
},
"theme.SearchModal.footer.closeKeyAriaLabel": {
"message": "エスケープキー",
"description": "The ARIA label for the Escape key button that close the modal"
},
"theme.SearchModal.footer.searchByText": {
"message": "検索",
"description": "The text explain that the search is making by Algolia"
},
"theme.SearchModal.noResultsScreen.noResultsText": {
"message": "見つかりませんでした",
"description": "The text explains that there are no results for the following search"
},
"theme.SearchModal.noResultsScreen.suggestedQueryText": {
"message": "次の検索を試す:",
"description": "The text for the suggested query when no results are found for the following search"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsText": {
"message": "よりよい検索結果がありますか?",
"description": "The text for the question where the user thinks there are missing results"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsLinkText": {
"message": "報告する",
"description": "The text for the link to report missing results"
},
"theme.SearchModal.placeholder": {
"message": "ドキュメントを検索",
"description": "The placeholder of the input of the DocSearch pop-up modal"
} }
} }

36
website/i18n/ja/docusaurus-plugin-content-docs/version-0.18.0.json
View File

@ -38,5 +38,41 @@
"sidebar.sidebar.category.More": { "sidebar.sidebar.category.More": {
"message": "More", "message": "More",
"description": "The label for category More in sidebar sidebar" "description": "The label for category More in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Services": {
"message": "Services",
"description": "The label for category Services in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
} }
} }

5
website/i18n/ja/docusaurus-plugin-content-docs/version-0.18.0/getting-started/choose-web-library.mdx
View File

@ -85,9 +85,8 @@ window.alert("hello from wasm!");
</td> </td>
<td style={{ textAlign: 'left' }}> <td style={{ textAlign: 'left' }}>
しばしば<code>Result</code> しばしば<code>Result</code>
を返さずpanicするようになっている。例えば <code> を返さずpanicするようになっている。例えば
stdweb::web::window() <code>stdweb::web::window()</code>
</code>
ワーカーの中で呼ばれるパニックする。 ワーカーの中で呼ばれるパニックする。
</td> </td>
</tr> </tr>

52
website/i18n/ja/docusaurus-plugin-content-docs/version-0.19.0.json
View File

@ -54,5 +54,57 @@
"sidebar.sidebar.category.yew-router": { "sidebar.sidebar.category.yew-router": {
"message": "yew-router", "message": "yew-router",
"description": "The label for category yew-router in sidebar sidebar" "description": "The label for category yew-router in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Function Components": {
"message": "Function Components",
"description": "The label for category Function Components in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
},
"sidebar.docs.category.Migration guides": {
"message": "Migration guides",
"description": "The label for category Migration guides in sidebar docs"
},
"sidebar.docs.category.yew": {
"message": "yew",
"description": "The label for category yew in sidebar docs"
},
"sidebar.docs.category.yew-agent": {
"message": "yew-agent",
"description": "The label for category yew-agent in sidebar docs"
},
"sidebar.docs.category.yew-router": {
"message": "yew-router",
"description": "The label for category yew-router in sidebar docs"
} }
} }

128
website/i18n/zh-Hans/code.json
View File

@ -295,5 +295,133 @@
"theme.docs.sidebar.toggleSidebarButtonAriaLabel": { "theme.docs.sidebar.toggleSidebarButtonAriaLabel": {
"message": "切换导航栏", "message": "切换导航栏",
"description": "The ARIA label for hamburger menu button of mobile navigation" "description": "The ARIA label for hamburger menu button of mobile navigation"
},
"theme.admonition.warning": {
"message": "注意",
"description": "The default label used for the Warning admonition (:::warning)"
},
"theme.DocSidebarItem.expandCategoryAriaLabel": {
"message": "展开侧边栏分类 '{label}'",
"description": "The ARIA label to expand the sidebar category"
},
"theme.DocSidebarItem.collapseCategoryAriaLabel": {
"message": "折叠侧边栏分类 '{label}'",
"description": "The ARIA label to collapse the sidebar category"
},
"theme.unlistedContent.title": {
"message": "未列出页",
"description": "The unlisted content banner title"
},
"theme.unlistedContent.message": {
"message": "此页面未列出。搜索引擎不会对其索引，只有拥有直接链接的用户才能访问。",
"description": "The unlisted content banner message"
},
"theme.SearchPage.inputPlaceholder": {
"message": "在此输入搜索字词",
"description": "The placeholder for search page input"
},
"theme.SearchPage.inputLabel": {
"message": "搜索",
"description": "The ARIA label for search page input"
},
"theme.SearchPage.algoliaLabel": {
"message": "通过 Algolia 搜索",
"description": "The ARIA label for Algolia mention"
},
"theme.SearchPage.fetchingNewResults": {
"message": "正在获取新的搜索结果...",
"description": "The paragraph for fetching new search results"
},
"theme.SearchModal.searchBox.resetButtonTitle": {
"message": "清除查询",
"description": "The label and ARIA label for search box reset button"
},
"theme.SearchModal.searchBox.cancelButtonText": {
"message": "取消",
"description": "The label and ARIA label for search box cancel button"
},
"theme.SearchModal.startScreen.recentSearchesTitle": {
"message": "最近搜索",
"description": "The title for recent searches"
},
"theme.SearchModal.startScreen.noRecentSearchesText": {
"message": "没有最近搜索",
"description": "The text when no recent searches"
},
"theme.SearchModal.startScreen.saveRecentSearchButtonTitle": {
"message": "保存这个搜索",
"description": "The label for save recent search button"
},
"theme.SearchModal.startScreen.removeRecentSearchButtonTitle": {
"message": "从历史记录中删除这个搜索",
"description": "The label for remove recent search button"
},
"theme.SearchModal.startScreen.favoriteSearchesTitle": {
"message": "收藏",
"description": "The title for favorite searches"
},
"theme.SearchModal.startScreen.removeFavoriteSearchButtonTitle": {
"message": "从收藏列表中删除这个搜索",
"description": "The label for remove favorite search button"
},
"theme.SearchModal.errorScreen.titleText": {
"message": "无法获取结果",
"description": "The title for error screen of search modal"
},
"theme.SearchModal.errorScreen.helpText": {
"message": "你可能需要检查网络连接。",
"description": "The help text for error screen of search modal"
},
"theme.SearchModal.footer.selectText": {
"message": "选中",
"description": "The explanatory text of the action for the enter key"
},
"theme.SearchModal.footer.selectKeyAriaLabel": {
"message": "Enter 键",
"description": "The ARIA label for the Enter key button that makes the selection"
},
"theme.SearchModal.footer.navigateText": {
"message": "导航",
"description": "The explanatory text of the action for the Arrow up and Arrow down key"
},
"theme.SearchModal.footer.navigateUpKeyAriaLabel": {
"message": "向上键",
"description": "The ARIA label for the Arrow up key button that makes the navigation"
},
"theme.SearchModal.footer.navigateDownKeyAriaLabel": {
"message": "向下键",
"description": "The ARIA label for the Arrow down key button that makes the navigation"
},
"theme.SearchModal.footer.closeText": {
"message": "关闭",
"description": "The explanatory text of the action for Escape key"
},
"theme.SearchModal.footer.closeKeyAriaLabel": {
"message": "Esc 键",
"description": "The ARIA label for the Escape key button that close the modal"
},
"theme.SearchModal.footer.searchByText": {
"message": "搜索提供",
"description": "The text explain that the search is making by Algolia"
},
"theme.SearchModal.noResultsScreen.noResultsText": {
"message": "没有结果：",
"description": "The text explains that there are no results for the following search"
},
"theme.SearchModal.noResultsScreen.suggestedQueryText": {
"message": "试试搜索",
"description": "The text for the suggested query when no results are found for the following search"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsText": {
"message": "认为这个查询应该有结果？",
"description": "The text for the question where the user thinks there are missing results"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsLinkText": {
"message": "请告知我们。",
"description": "The text for the link to report missing results"
},
"theme.SearchModal.placeholder": {
"message": "搜索文档",
"description": "The placeholder of the input of the DocSearch pop-up modal"
} }
} }

6
website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/advanced-topics/optimizations.mdx
View File

@ -23,9 +23,7 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。 但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。
{% code title="neq\_assign.rs" %} ```rust title="neq_assign.rs"
```rust
pub trait NeqAssign { pub trait NeqAssign {
fn neq_assign(&mut self, new: Self) -> ShouldRender; fn neq_assign(&mut self, new: Self) -> ShouldRender;
} }
@ -46,8 +44,6 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
} }
``` ```
{% endcode %}
该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。 该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。
这比简单的实现还要短： 这比简单的实现还要短：

24
website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。 如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 拥有 Props 的嵌套子组件 ## 拥有 Props 的嵌套子组件
如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。 如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

12
website/i18n/zh-Hans/docusaurus-plugin-content-docs/current/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew） 添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -21,13 +19,9 @@ edition = "2018"
yew = { version = "0.14.3", features = ["std_web"] } yew = { version = "0.14.3", features = ["std_web"] }
``` ```
{% endcode %}
将这份代码复制到你的 `src/main.rs` 文件中: 将这份代码复制到你的 `src/main.rs` 文件中:
{% code title="src/main.rs" %} ```rust title="src/main.rs"
```rust
use yew::prelude::*; use yew::prelude::*;
struct Model { struct Model {
@ -72,8 +66,6 @@ fn main() {
} }
``` ```
{% endcode %}
这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。 这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。
## 运行你的应用程序! ## 运行你的应用程序!

36
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.18.0.json
View File

@ -38,5 +38,41 @@
"sidebar.sidebar.category.More": { "sidebar.sidebar.category.More": {
"message": "More", "message": "More",
"description": "The label for category More in sidebar sidebar" "description": "The label for category More in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Services": {
"message": "Services",
"description": "The label for category Services in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
} }
} }

24
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.18.0/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。 如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 拥有 Props 的嵌套子组件 ## 拥有 Props 的嵌套子组件
如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。 如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

2
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.18.0/getting-started/build-a-sample-app.mdx
View File

@ -88,7 +88,7 @@ fn main() {
最后，将`index.html`文件添加当前应用的根目录下： 最后，将`index.html`文件添加当前应用的根目录下：
```html ```html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.18.0/getting-started/project-setup/using-trunk.mdx
View File

@ -19,7 +19,7 @@ Trunk 基于`index.html`文件构建您的应用，并将其作为配置文件
要构建一个简单的 Yew 应用程序，您只需要在项目的根目录下创建`index.html`： 要构建一个简单的 Yew 应用程序，您只需要在项目的根目录下创建`index.html`：
```html ```html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

52
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.19.0.json
View File

@ -54,5 +54,57 @@
"sidebar.sidebar.category.yew-router": { "sidebar.sidebar.category.yew-router": {
"message": "yew-router", "message": "yew-router",
"description": "The label for category yew-router in sidebar sidebar" "description": "The label for category yew-router in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Function Components": {
"message": "Function Components",
"description": "The label for category Function Components in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
},
"sidebar.docs.category.Migration guides": {
"message": "Migration guides",
"description": "The label for category Migration guides in sidebar docs"
},
"sidebar.docs.category.yew": {
"message": "yew",
"description": "The label for category yew in sidebar docs"
},
"sidebar.docs.category.yew-agent": {
"message": "yew-agent",
"description": "The label for category yew-agent in sidebar docs"
},
"sidebar.docs.category.yew-router": {
"message": "yew-router",
"description": "The label for category yew-router in sidebar docs"
} }
} }

6
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.20/advanced-topics/optimizations.mdx
View File

@ -23,9 +23,7 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。 但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。
{% code title="neq\_assign.rs" %} ```rust title="neq_assign.rs"
```rust
pub trait NeqAssign { pub trait NeqAssign {
fn neq_assign(&mut self, new: Self) -> ShouldRender; fn neq_assign(&mut self, new: Self) -> ShouldRender;
} }
@ -46,8 +44,6 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
} }
``` ```
{% endcode %}
该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。 该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。
这比简单的实现还要短： 这比简单的实现还要短：

24
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.20/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。 如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 拥有 Props 的嵌套子组件 ## 拥有 Props 的嵌套子组件
如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。 如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

12
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.20/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew） 添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -21,13 +19,9 @@ edition = "2018"
yew = { version = "0.14.3", features = ["std_web"] } yew = { version = "0.14.3", features = ["std_web"] }
``` ```
{% endcode %}
将这份代码复制到你的 `src/main.rs` 文件中: 将这份代码复制到你的 `src/main.rs` 文件中:
{% code title="src/main.rs" %} ```rust title="src/main.rs"
```rust
use yew::prelude::*; use yew::prelude::*;
struct Model { struct Model {
@ -72,8 +66,6 @@ fn main() {
} }
``` ```
{% endcode %}
这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。 这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。
## 运行你的应用程序! ## 运行你的应用程序!

6
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.21/advanced-topics/optimizations.mdx
View File

@ -23,9 +23,7 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。 但是我们可以更进一步！对于任何实现了 `PartialEq` 的项，可以使用一个 trait 和一个 blanket implementation 将这六行样板代码减少到一行。
{% code title="neq\_assign.rs" %} ```rust title="neq_assign.rs"
```rust
pub trait NeqAssign { pub trait NeqAssign {
fn neq_assign(&mut self, new: Self) -> ShouldRender; fn neq_assign(&mut self, new: Self) -> ShouldRender;
} }
@ -46,8 +44,6 @@ fn change(&mut self, props: Self::Properties) -> ShouldRender {
} }
``` ```
{% endcode %}
该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。 该 trait 称为 `NeqAssign` 是因为如果目标值和新值不相等，它将赋为新值。
这比简单的实现还要短： 这比简单的实现还要短：

24
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.21/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。 如果组件的 `Properties` 中有 `children` 字段，则可以被传递子组件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 拥有 Props 的嵌套子组件 ## 拥有 Props 的嵌套子组件
如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。 如果包含组件标注了 children 的类型，则可以访问和更改嵌套组件的属性。在下面的示例中，`List` 组件可以包含 `ListItem` 组件。有关此模式的真实示例，请查看 `yew-router` 的源码。有关更高级的示例，请在 yew 主仓库中查看 `nested-list` 示例代码。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

12
website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-0.21/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew） 添加 `yew` 到你的依赖库中（[这里](https://docs.rs/yew) 可以查看最新版本的 Yew）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -21,13 +19,9 @@ edition = "2018"
yew = { version = "0.14.3", features = ["std_web"] } yew = { version = "0.14.3", features = ["std_web"] }
``` ```
{% endcode %}
将这份代码复制到你的 `src/main.rs` 文件中: 将这份代码复制到你的 `src/main.rs` 文件中:
{% code title="src/main.rs" %} ```rust title="src/main.rs"
```rust
use yew::prelude::*; use yew::prelude::*;
struct Model { struct Model {
@ -72,8 +66,6 @@ fn main() {
} }
``` ```
{% endcode %}
这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。 这份代码将构建你的称为 `Model` 的 `Component` 根组件，它会显示一个按钮，当你点击它时，`Model` 将会更新自己的状态。特别注意 `main()` 中的 `App::<Model>::new().mount_to_body()`，它会启动你的应用并将其挂载到页面的 `<body>` 标签中。如果你想使用任何动态属性来启动应用程序，则可以使用 `App::<Model>::new().mount_to_body_with_props(..)`。
## 运行你的应用程序! ## 运行你的应用程序!

128
website/i18n/zh-Hant/code.json
View File

@ -295,5 +295,133 @@
"theme.docs.sidebar.toggleSidebarButtonAriaLabel": { "theme.docs.sidebar.toggleSidebarButtonAriaLabel": {
"message": "Toggle navigation bar", "message": "Toggle navigation bar",
"description": "The ARIA label for hamburger menu button of mobile navigation" "description": "The ARIA label for hamburger menu button of mobile navigation"
},
"theme.admonition.warning": {
"message": "warning",
"description": "The default label used for the Warning admonition (:::warning)"
},
"theme.DocSidebarItem.expandCategoryAriaLabel": {
"message": "Expand sidebar category '{label}'",
"description": "The ARIA label to expand the sidebar category"
},
"theme.DocSidebarItem.collapseCategoryAriaLabel": {
"message": "Collapse sidebar category '{label}'",
"description": "The ARIA label to collapse the sidebar category"
},
"theme.unlistedContent.title": {
"message": "未列出頁",
"description": "The unlisted content banner title"
},
"theme.unlistedContent.message": {
"message": "此頁面未列出。搜索引擎不會對其索引，只有擁有直接連結的用戶才能訪問。",
"description": "The unlisted content banner message"
},
"theme.SearchPage.inputPlaceholder": {
"message": "在此輸入搜尋字詞",
"description": "The placeholder for search page input"
},
"theme.SearchPage.inputLabel": {
"message": "搜尋",
"description": "The ARIA label for search page input"
},
"theme.SearchPage.algoliaLabel": {
"message": "透過 Algolia 搜尋",
"description": "The ARIA label for Algolia mention"
},
"theme.SearchPage.fetchingNewResults": {
"message": "正在取得新的搜尋結果...",
"description": "The paragraph for fetching new search results"
},
"theme.SearchModal.searchBox.resetButtonTitle": {
"message": "清除查詢",
"description": "The label and ARIA label for search box reset button"
},
"theme.SearchModal.searchBox.cancelButtonText": {
"message": "取消",
"description": "The label and ARIA label for search box cancel button"
},
"theme.SearchModal.startScreen.recentSearchesTitle": {
"message": "最近搜索",
"description": "The title for recent searches"
},
"theme.SearchModal.startScreen.noRecentSearchesText": {
"message": "沒有最近搜索",
"description": "The text when no recent searches"
},
"theme.SearchModal.startScreen.saveRecentSearchButtonTitle": {
"message": "保存這個搜索",
"description": "The label for save recent search button"
},
"theme.SearchModal.startScreen.removeRecentSearchButtonTitle": {
"message": "從歷史記錄中刪除這個搜索",
"description": "The label for remove recent search button"
},
"theme.SearchModal.startScreen.favoriteSearchesTitle": {
"message": "收藏",
"description": "The title for favorite searches"
},
"theme.SearchModal.startScreen.removeFavoriteSearchButtonTitle": {
"message": "從收藏列表中刪除這個搜索",
"description": "The label for remove favorite search button"
},
"theme.SearchModal.errorScreen.titleText": {
"message": "無法獲取結果",
"description": "The title for error screen of search modal"
},
"theme.SearchModal.errorScreen.helpText": {
"message": "你可能需要檢查網路連接。",
"description": "The help text for error screen of search modal"
},
"theme.SearchModal.footer.selectText": {
"message": "選中",
"description": "The explanatory text of the action for the enter key"
},
"theme.SearchModal.footer.selectKeyAriaLabel": {
"message": "Enter 鍵",
"description": "The ARIA label for the Enter key button that makes the selection"
},
"theme.SearchModal.footer.navigateText": {
"message": "導航",
"description": "The explanatory text of the action for the Arrow up and Arrow down key"
},
"theme.SearchModal.footer.navigateUpKeyAriaLabel": {
"message": "向上鍵",
"description": "The ARIA label for the Arrow up key button that makes the navigation"
},
"theme.SearchModal.footer.navigateDownKeyAriaLabel": {
"message": "向下鍵",
"description": "The ARIA label for the Arrow down key button that makes the navigation"
},
"theme.SearchModal.footer.closeText": {
"message": "關閉",
"description": "The explanatory text of the action for Escape key"
},
"theme.SearchModal.footer.closeKeyAriaLabel": {
"message": "Esc 鍵",
"description": "The ARIA label for the Escape key button that close the modal"
},
"theme.SearchModal.footer.searchByText": {
"message": "搜索提供",
"description": "The text explain that the search is making by Algolia"
},
"theme.SearchModal.noResultsScreen.noResultsText": {
"message": "沒有結果：",
"description": "The text explains that there are no results for the following search"
},
"theme.SearchModal.noResultsScreen.suggestedQueryText": {
"message": "試試搜索",
"description": "The text for the suggested query when no results are found for the following search"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsText": {
"message": "認為這個查詢應該有結果？",
"description": "The text for the question where the user thinks there are missing results"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsLinkText": {
"message": "請告知我們。",
"description": "The text for the link to report missing results"
},
"theme.SearchModal.placeholder": {
"message": "搜索文檔",
"description": "The placeholder of the input of the DocSearch pop-up modal"
} }
} }

24
website/i18n/zh-Hant/docusaurus-plugin-content-docs/current/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。 只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 指定子結點的型別 ## 指定子結點的型別
如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。 如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

18
website/i18n/zh-Hant/docusaurus-plugin-content-docs/current/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)） 在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -22,13 +20,9 @@ yew = "0.16"
wasm-bindgen = "0.2" wasm-bindgen = "0.2"
``` ```
{% endcode %}
將下面的模板複製進你的 `src/lib.rs` 檔案： 將下面的模板複製進你的 `src/lib.rs` 檔案：
{% code title="src/lib.rs" %} ```rust title="src/lib.rs"
```rust
use wasm_bindgen::prelude::*; use wasm_bindgen::prelude::*;
use yew::prelude::*; use yew::prelude::*;
@ -80,8 +74,6 @@ pub fn run_app() {
} }
``` ```
{% endcode %}
模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。 模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。
最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。 最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。
@ -90,9 +82,7 @@ pub fn run_app() {
mkdir static mkdir static
``` ```
{% code title="index.html" %} ```bash title="index.html"
```bash
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
@ -107,8 +97,6 @@ mkdir static
</html> </html>
``` ```
{% endcode %}
## 執行你的 App！ ## 執行你的 App！
使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器： 使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器：

36
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.18.0.json
View File

@ -38,5 +38,41 @@
"sidebar.sidebar.category.More": { "sidebar.sidebar.category.More": {
"message": "More", "message": "More",
"description": "The label for category More in sidebar sidebar" "description": "The label for category More in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Services": {
"message": "Services",
"description": "The label for category Services in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
} }
} }

24
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.18.0/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。 只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 指定子結點的型別 ## 指定子結點的型別
如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。 如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

18
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.18.0/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)） 在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -22,13 +20,9 @@ yew = "0.16"
wasm-bindgen = "0.2" wasm-bindgen = "0.2"
``` ```
{% endcode %}
將下面的模板複製進你的 `src/lib.rs` 檔案： 將下面的模板複製進你的 `src/lib.rs` 檔案：
{% code title="src/lib.rs" %} ```rust title="src/lib.rs"
```rust
use wasm_bindgen::prelude::*; use wasm_bindgen::prelude::*;
use yew::prelude::*; use yew::prelude::*;
@ -80,8 +74,6 @@ pub fn run_app() {
} }
``` ```
{% endcode %}
模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。 模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。
最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。 最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。
@ -90,9 +82,7 @@ pub fn run_app() {
mkdir static mkdir static
``` ```
{% code title="index.html" %} ```bash title="index.html"
```bash
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
@ -107,8 +97,6 @@ mkdir static
</html> </html>
``` ```
{% endcode %}
## 執行你的 App！ ## 執行你的 App！
使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器： 使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器：

6
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.18.0/getting-started/choose-web-library.mdx
View File

@ -4,9 +4,7 @@
Yew apps 可以用 `web-sys` 或 `stdweb` 編譯。這兩個 creates 都提供了 Rust 與 WebAPIs 的連結。當把 `yew` 加進你的依賴時，請擇其一使用： Yew apps 可以用 `web-sys` 或 `stdweb` 編譯。這兩個 creates 都提供了 Rust 與 WebAPIs 的連結。當把 `yew` 加進你的依賴時，請擇其一使用：
{% code title="Cargo.toml" %} ```rust title="Cargo.toml"
```rust
# 選擇 `web-sys` # 選擇 `web-sys`
yew = { version = "0.13", features = ["web_sys"] } yew = { version = "0.13", features = ["web_sys"] }
@ -14,8 +12,6 @@ yew = { version = "0.13", features = ["web_sys"] }
yew = { version = "0.13", features = ["std_web"] } yew = { version = "0.13", features = ["std_web"] }
``` ```
{% endcode %}
我們建議使用 `web-sys`，因為他是由 [Rust / Wasm Working Group](https://rustwasm.github.io/) 維護。 我們建議使用 `web-sys`，因為他是由 [Rust / Wasm Working Group](https://rustwasm.github.io/) 維護。
## 使用範例 ## 使用範例

6
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.18.0/getting-started/starter-templates.mdx
View File

@ -9,9 +9,7 @@
你的 `Cargo.toml` 必須要設定一個 `cdylib` 的 crate-type。 你的 `Cargo.toml` 必須要設定一個 `cdylib` 的 crate-type。
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -29,8 +27,6 @@ yew = 0.15
wasm-bindgen = "0.2" wasm-bindgen = "0.2"
``` ```
{% endcode %}
## 其他的模板 ## 其他的模板
- [Parcel Template](https://github.com/spielrs/yew-parcel-template) - 由一個社群成員用 [Parcel](https://parceljs.org/) 製作 - [Parcel Template](https://github.com/spielrs/yew-parcel-template) - 由一個社群成員用 [Parcel](https://parceljs.org/) 製作

52
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.19.0.json
View File

@ -54,5 +54,57 @@
"sidebar.sidebar.category.yew-router": { "sidebar.sidebar.category.yew-router": {
"message": "yew-router", "message": "yew-router",
"description": "The label for category yew-router in sidebar sidebar" "description": "The label for category yew-router in sidebar sidebar"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Project Setup": {
"message": "Project Setup",
"description": "The label for category Project Setup in sidebar docs"
},
"sidebar.docs.category.Concepts": {
"message": "Concepts",
"description": "The label for category Concepts in sidebar docs"
},
"sidebar.docs.category.wasm-bindgen": {
"message": "wasm-bindgen",
"description": "The label for category wasm-bindgen in sidebar docs"
},
"sidebar.docs.category.Components": {
"message": "Components",
"description": "The label for category Components in sidebar docs"
},
"sidebar.docs.category.HTML": {
"message": "HTML",
"description": "The label for category HTML in sidebar docs"
},
"sidebar.docs.category.Function Components": {
"message": "Function Components",
"description": "The label for category Function Components in sidebar docs"
},
"sidebar.docs.category.Advanced topics": {
"message": "Advanced topics",
"description": "The label for category Advanced topics in sidebar docs"
},
"sidebar.docs.category.More": {
"message": "More",
"description": "The label for category More in sidebar docs"
},
"sidebar.docs.category.Migration guides": {
"message": "Migration guides",
"description": "The label for category Migration guides in sidebar docs"
},
"sidebar.docs.category.yew": {
"message": "yew",
"description": "The label for category yew in sidebar docs"
},
"sidebar.docs.category.yew-agent": {
"message": "yew-agent",
"description": "The label for category yew-agent in sidebar docs"
},
"sidebar.docs.category.yew-router": {
"message": "yew-router",
"description": "The label for category yew-router in sidebar docs"
} }
} }

24
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.20/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。 只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 指定子結點的型別 ## 指定子結點的型別
如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。 如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

18
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.20/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)） 在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -22,13 +20,9 @@ yew = "0.16"
wasm-bindgen = "0.2" wasm-bindgen = "0.2"
``` ```
{% endcode %}
將下面的模板複製進你的 `src/lib.rs` 檔案： 將下面的模板複製進你的 `src/lib.rs` 檔案：
{% code title="src/lib.rs" %} ```rust title="src/lib.rs"
```rust
use wasm_bindgen::prelude::*; use wasm_bindgen::prelude::*;
use yew::prelude::*; use yew::prelude::*;
@ -80,8 +74,6 @@ pub fn run_app() {
} }
``` ```
{% endcode %}
模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。 模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。
最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。 最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。
@ -90,9 +82,7 @@ pub fn run_app() {
mkdir static mkdir static
``` ```
{% code title="index.html" %} ```bash title="index.html"
```bash
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
@ -107,8 +97,6 @@ mkdir static
</html> </html>
``` ```
{% endcode %}
## 執行你的 App！ ## 執行你的 App！
使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器： 使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器：

24
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.21/concepts/html/components.mdx
View File

@ -27,9 +27,7 @@ html!{
只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。 只要元件的 `Properties` 中有 `children`，就可以傳遞子結點給元件。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<Container> <Container>
<h4>{ "Hi" }</h4> <h4>{ "Hi" }</h4>
@ -38,11 +36,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="container.rs"
{% code title="container.rs" %}
```rust
pub struct Container(Props); pub struct Container(Props);
#[derive(Properties)] #[derive(Properties)]
@ -65,15 +59,11 @@ impl Component for Container {
} }
``` ```
{% endcode %}
## 指定子結點的型別 ## 指定子結點的型別
如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。 如果指定了子結點的型別，就可以使用或改變巢狀元件的屬性。下面的範例就是， `List` 元件包裹 `ListItem` 元件。另一個真實的範例是 `yew-router` 的原始碼。還有一個更進階的範例，請參考 Yew GitHub repo 中的 `nested-list` 範例。
{% code title="parent.rs" %} ```rust title="parent.rs"
```rust
html! { html! {
<List> <List>
<ListItem value="a" /> <ListItem value="a" />
@ -83,11 +73,7 @@ html! {
} }
``` ```
{% endcode %} ```rust title="list.rs"
{% code title="list.rs" %}
```rust
pub struct List(Props); pub struct List(Props);
#[derive(Properties)] #[derive(Properties)]
@ -110,5 +96,3 @@ impl Component for List {
} }
} }
``` ```
{% endcode %}

18
website/i18n/zh-Hant/docusaurus-plugin-content-docs/version-0.21/getting-started/build-a-sample-app.mdx
View File

@ -8,9 +8,7 @@ cargo new --bin yew-app && cd yew-app
在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)） 在依賴庫裡加入 `yew` 與 `wasm-bindgen`（最新的版號，請參考[這裡](https://docs.rs/yew)）
{% code title="Cargo.toml" %} ```text title="Cargo.toml"
```text
[package] [package]
name = "yew-app" name = "yew-app"
version = "0.1.0" version = "0.1.0"
@ -22,13 +20,9 @@ yew = "0.16"
wasm-bindgen = "0.2" wasm-bindgen = "0.2"
``` ```
{% endcode %}
將下面的模板複製進你的 `src/lib.rs` 檔案： 將下面的模板複製進你的 `src/lib.rs` 檔案：
{% code title="src/lib.rs" %} ```rust title="src/lib.rs"
```rust
use wasm_bindgen::prelude::*; use wasm_bindgen::prelude::*;
use yew::prelude::*; use yew::prelude::*;
@ -80,8 +74,6 @@ pub fn run_app() {
} }
``` ```
{% endcode %}
模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。 模板會建置名叫 `Model` 的根元件 `Component`，Model 會顯示一個按鈕，當你按下按鈕時， `Model` 會更新自己的狀態。需要特別注意的是，在 `main()` 裡的 `App::<Model>::new().mount_to_body()`，他會啟動你的 app 並且掛載 `Model` 裡的 HTML 到 `<body>` 標籤中。如果你想要在啟動應用程式時，帶入動態的屬性，你可以改用 `App::<Model>::new().mount_to_body_with_props(..)`。
最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。 最後，在你的專案，新增 `static` 資料夾，並新增 `index.html` 檔案到 static 裡。
@ -90,9 +82,7 @@ pub fn run_app() {
mkdir static mkdir static
``` ```
{% code title="index.html" %} ```bash title="index.html"
```bash
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
@ -107,8 +97,6 @@ mkdir static
</html> </html>
``` ```
{% endcode %}
## 執行你的 App！ ## 執行你的 App！
使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器： 使用 [`wasm-pack`](https://rustwasm.github.io/docs/wasm-pack/) 來執行專案是比較好的選擇。如果你還沒有做任何準備，先用`cargo install wasm-pack`安裝 `wasm-pack` ，然後用下面的指令，建置與開啟開發用伺服器：

10111
website/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

45
website/package.json
View File

@ -17,21 +17,17 @@
"fmt:write": "prettier --write ." "fmt:write": "prettier --write ."
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "^2.4.3", "@docusaurus/core": "^3.0.0",
"@docusaurus/plugin-client-redirects": "^2.4.3", "@docusaurus/plugin-client-redirects": "^3.0.0",
"@docusaurus/plugin-content-docs": "^2.4.3", "@docusaurus/preset-classic": "^3.0.0",
"@docusaurus/plugin-content-pages": "^2.4.3", "@mdx-js/react": "^3.0.0",
"@docusaurus/plugin-google-gtag": "^2.4.3", "@svgr/webpack": "^8.1.0",
"@docusaurus/theme-classic": "^2.4.3", "clsx": "^2.0.0",
"@easyops-cn/docusaurus-search-local": "^0.32.0", "docusaurus-plugin-sass": "^0.2.5",
"@mdx-js/react": "^1.6.22",
"@svgr/webpack": "^8.0.1",
"clsx": "^1.1.1",
"docusaurus-plugin-sass": "^0.2.2",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"react": "^17.0.2", "react": "^18.2.0",
"react-dom": "^17.0.2", "react-dom": "^18.2.0",
"sass": "^1.55.0", "sass": "^1.69.5",
"url-loader": "^4.1.1" "url-loader": "^4.1.1"
}, },
"browserslist": { "browserslist": {
@ -46,16 +42,19 @@
"last 1 safari version" "last 1 safari version"
] ]
}, },
"engines": {
"node": ">=18.0"
},
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "^2.4.3", "@docusaurus/module-type-aliases": "^3.0.0",
"@tsconfig/docusaurus": "^2.0.0", "@docusaurus/tsconfig": "3.0.0",
"@types/react": "^17.0.43", "@types/react": "^18.2.34",
"@types/react-helmet": "^6.1.6", "@types/react-helmet": "^6.1.8",
"@types/react-router-dom": "^5.3.3", "@types/react-router-dom": "^5.3.3",
"@typescript-eslint/eslint-plugin": "^5.57.0", "@typescript-eslint/eslint-plugin": "^6.9.1",
"@typescript-eslint/parser": "^5.54.0", "@typescript-eslint/parser": "^6.9.1",
"dir-compare": "^4.0.0", "dir-compare": "^4.2.0",
"prettier": "^2.8.8", "prettier": "^3.0.3",
"typescript": "^4.8.3" "typescript": "^5.2.2"
} }
} }

2
website/tsconfig.json
View File

@ -1,4 +1,4 @@
{ {
"extends": "@tsconfig/docusaurus/tsconfig.json", "extends": "@docusaurus/tsconfig",
"include": ["src/"] "include": ["src/"]
} }

2
website/versioned_docs/version-0.18.0/getting-started/build-a-sample-app.mdx
View File

@ -90,7 +90,7 @@ If you would like to start your application with any dynamic properties, you can
Finally, add an `index.html` file in the root directory of your app: Finally, add an `index.html` file in the root directory of your app:
```html ```html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/versioned_docs/version-0.18.0/getting-started/project-setup/using-trunk.mdx
View File

@ -23,7 +23,7 @@ as an entry point.
To build a simple Yew app you just need an `index.html` file at the root of your project: To build a simple Yew app you just need an `index.html` file at the root of your project:
```html ```html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/versioned_docs/version-0.19.0/getting-started/project-setup/using-trunk.mdx
View File

@ -24,7 +24,7 @@ as an entry point.
To build a simple Yew app you just need an `index.html` file at the root of your project: To build a simple Yew app you just need an `index.html` file at the root of your project:
```html ```html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/versioned_docs/version-0.19.0/tutorial/index.mdx
View File

@ -99,7 +99,7 @@ fn main() {
Now, let's create an `index.html` at the root of the project. Now, let's create an `index.html` at the root of the project.
```html title="index.html" ```html title="index.html"
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> </head> <head> </head>
<body></body> <body></body>

2
website/versioned_docs/version-0.20/getting-started/build-a-sample-app.mdx
View File

@ -122,7 +122,7 @@ fn main() {
Finally, add an `index.html` file in the root directory of your app. Finally, add an `index.html` file in the root directory of your app.
```html , title=index.html ```html , title=index.html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/versioned_docs/version-0.20/getting-started/examples.mdx
View File

@ -9,7 +9,7 @@ We also welcome Pull Requests and issues for when they inevitably get neglected
For more details including a list of examples, refer to the [README]. For more details including a list of examples, refer to the [README].
:::note :::note
Most of the examples have a live deployment that can be found at https://examples.yew.rs/<example_name>. Most of the examples have a live deployment that can be found at https://examples.yew.rs/< example_name >.
Click the shield on their individual README page in their respective sub-folder to navigate to the live demo. Click the shield on their individual README page in their respective sub-folder to navigate to the live demo.
::: :::

2
website/versioned_docs/version-0.20/tutorial/index.mdx
View File

@ -105,7 +105,7 @@ fn main() {
Now, let's create an `index.html` at the root of the project. Now, let's create an `index.html` at the root of the project.
```html title="index.html" ```html title="index.html"
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head></head> <head></head>
<body></body> <body></body>

2
website/versioned_docs/version-0.21/getting-started/build-a-sample-app.mdx
View File

@ -115,7 +115,7 @@ fn main() {
Finally, add an `index.html` file in the root directory of your app. Finally, add an `index.html` file in the root directory of your app.
```html , title=index.html ```html , title=index.html
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

2
website/versioned_docs/version-0.21/getting-started/examples.mdx
View File

@ -9,7 +9,7 @@ We also welcome Pull Requests and issues for when they inevitably get neglected
For more details including a list of examples, refer to the [README]. For more details including a list of examples, refer to the [README].
:::note :::note
Most of the examples have a live deployment that can be found at https://examples.yew.rs/<example_name>. Most of the examples have a live deployment that can be found at https://examples.yew.rs/< example_name >.
Click the shield on their README page in their respective sub-folder to navigate to the live demo. Click the shield on their README page in their respective sub-folder to navigate to the live demo.
::: :::

2
website/versioned_docs/version-0.21/tutorial/index.mdx
View File

@ -105,7 +105,7 @@ fn main() {
Now, let's create an `index.html` at the root of the project. Now, let's create an `index.html` at the root of the project.
```html title="index.html" ```html title="index.html"
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head></head> <head></head>
<body></body> <body></body>

70
website/versioned_sidebars/version-0.18.0-sidebars.json
View File

@ -1,5 +1,5 @@
{ {
"version-0.18.0/sidebar": [ "docs": [
{ {
"collapsed": true, "collapsed": true,
"type": "category", "type": "category",
@ -12,37 +12,37 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/introduction" "id": "getting-started/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/project-setup/using-trunk" "id": "getting-started/project-setup/using-trunk"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/project-setup/using-wasm-pack" "id": "getting-started/project-setup/using-wasm-pack"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/project-setup/using-cargo-web" "id": "getting-started/project-setup/using-cargo-web"
} }
] ]
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/build-a-sample-app" "id": "getting-started/build-a-sample-app"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/choose-web-library" "id": "getting-started/choose-web-library"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/examples" "id": "getting-started/examples"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/getting-started/starter-templates" "id": "getting-started/starter-templates"
} }
] ]
}, },
@ -58,23 +58,23 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/components/introduction" "id": "concepts/components/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/components/callbacks" "id": "concepts/components/callbacks"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/components/properties" "id": "concepts/components/properties"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/components/children" "id": "concepts/components/children"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/components/refs" "id": "concepts/components/refs"
} }
] ]
}, },
@ -85,11 +85,11 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/wasm-bindgen/wasm-bindgen" "id": "concepts/wasm-bindgen/wasm-bindgen"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/wasm-bindgen/web-sys" "id": "concepts/wasm-bindgen/web-sys"
} }
] ]
}, },
@ -100,31 +100,31 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/introduction" "id": "concepts/html/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/components" "id": "concepts/html/components"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/elements" "id": "concepts/html/elements"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/events" "id": "concepts/html/events"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/classes" "id": "concepts/html/classes"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/lists" "id": "concepts/html/lists"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/html/literals-and-expressions" "id": "concepts/html/literals-and-expressions"
} }
] ]
}, },
@ -135,25 +135,25 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/services/introduction" "id": "concepts/services/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/services/fetch" "id": "concepts/services/fetch"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/services/format" "id": "concepts/services/format"
} }
] ]
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/router" "id": "concepts/router"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/concepts/agents" "id": "concepts/agents"
} }
] ]
}, },
@ -164,11 +164,11 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/advanced-topics/how-it-works" "id": "advanced-topics/how-it-works"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/advanced-topics/optimizations" "id": "advanced-topics/optimizations"
} }
] ]
}, },
@ -179,23 +179,23 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/more/debugging" "id": "more/debugging"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/more/css" "id": "more/css"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/more/external-libs" "id": "more/external-libs"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/more/testing" "id": "more/testing"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.18.0/more/roadmap" "id": "more/roadmap"
} }
] ]
} }

86
website/versioned_sidebars/version-0.19.0-sidebars.json
View File

@ -1,5 +1,5 @@
{ {
"version-0.19.0/sidebar": [ "docs": [
{ {
"type": "category", "type": "category",
"label": "Getting Started", "label": "Getting Started",
@ -10,15 +10,15 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/introduction" "id": "getting-started/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/project-setup/using-trunk" "id": "getting-started/project-setup/using-trunk"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/project-setup/using-wasm-pack" "id": "getting-started/project-setup/using-wasm-pack"
} }
], ],
"collapsible": true, "collapsible": true,
@ -26,15 +26,15 @@
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/build-a-sample-app" "id": "getting-started/build-a-sample-app"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/examples" "id": "getting-started/examples"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/getting-started/starter-templates" "id": "getting-started/starter-templates"
} }
], ],
"collapsible": true, "collapsible": true,
@ -50,11 +50,11 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/wasm-bindgen/introduction" "id": "concepts/wasm-bindgen/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/wasm-bindgen/web-sys" "id": "concepts/wasm-bindgen/web-sys"
} }
], ],
"collapsible": true, "collapsible": true,
@ -66,27 +66,27 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/introduction" "id": "concepts/components/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/callbacks" "id": "concepts/components/callbacks"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/scope" "id": "concepts/components/scope"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/properties" "id": "concepts/components/properties"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/children" "id": "concepts/components/children"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/components/refs" "id": "concepts/components/refs"
} }
], ],
"collapsible": true, "collapsible": true,
@ -98,35 +98,35 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/introduction" "id": "concepts/html/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/components" "id": "concepts/html/components"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/elements" "id": "concepts/html/elements"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/events" "id": "concepts/html/events"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/classes" "id": "concepts/html/classes"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/fragments" "id": "concepts/html/fragments"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/lists" "id": "concepts/html/lists"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/html/literals-and-expressions" "id": "concepts/html/literals-and-expressions"
} }
], ],
"collapsible": true, "collapsible": true,
@ -138,19 +138,19 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/function-components/introduction" "id": "concepts/function-components/introduction"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/function-components/attribute" "id": "concepts/function-components/attribute"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/function-components/pre-defined-hooks" "id": "concepts/function-components/pre-defined-hooks"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/function-components/custom-hooks" "id": "concepts/function-components/custom-hooks"
} }
], ],
"collapsible": true, "collapsible": true,
@ -158,15 +158,15 @@
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/agents" "id": "concepts/agents"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/contexts" "id": "concepts/contexts"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/concepts/router" "id": "concepts/router"
} }
], ],
"collapsible": true, "collapsible": true,
@ -178,15 +178,15 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/advanced-topics/how-it-works" "id": "advanced-topics/how-it-works"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/advanced-topics/optimizations" "id": "advanced-topics/optimizations"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/advanced-topics/portals" "id": "advanced-topics/portals"
} }
], ],
"collapsible": true, "collapsible": true,
@ -198,31 +198,31 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/debugging" "id": "more/debugging"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/development-tips" "id": "more/development-tips"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/external-libs" "id": "more/external-libs"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/css" "id": "more/css"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/testing" "id": "more/testing"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/roadmap" "id": "more/roadmap"
}, },
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/more/wasm-build-tools" "id": "more/wasm-build-tools"
} }
], ],
"collapsible": true, "collapsible": true,
@ -238,7 +238,7 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/migration-guides/yew/from-0_18_0-to-0_19_0" "id": "migration-guides/yew/from-0_18_0-to-0_19_0"
} }
], ],
"collapsible": true, "collapsible": true,
@ -250,7 +250,7 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/migration-guides/yew-agent/from-0_0_0-to-0_1_0" "id": "migration-guides/yew-agent/from-0_0_0-to-0_1_0"
} }
], ],
"collapsible": true, "collapsible": true,
@ -262,7 +262,7 @@
"items": [ "items": [
{ {
"type": "doc", "type": "doc",
"id": "version-0.19.0/migration-guides/yew-router/from-0_15_0-to-0_16_0" "id": "migration-guides/yew-router/from-0_15_0-to-0_16_0"
} }
], ],
"collapsible": true, "collapsible": true,