{"id":16157896,"url":"https://github.com/mrxiaozhuox/dioxus-guide-cn","last_synced_at":"2025-10-09T06:40:04.825Z","repository":{"id":49847154,"uuid":"447521254","full_name":"mrxiaozhuox/dioxus-guide-cn","owner":"mrxiaozhuox","description":"Dioxus 中文开发文档 【Dioxus交流群：863409183】⚠️ 本文档已停止维护，请前往 DioxusChina/website","archived":false,"fork":false,"pushed_at":"2022-07-27T07:35:35.000Z","size":590,"stargazers_count":16,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-11T15:03:01.562Z","etag":null,"topics":["dioxus","document"],"latest_commit_sha":null,"homepage":"https://dioxus.cn/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mrxiaozhuox.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-01-13T08:29:40.000Z","updated_at":"2024-10-04T08:44:24.000Z","dependencies_parsed_at":"2022-09-13T11:32:01.431Z","dependency_job_id":null,"html_url":"https://github.com/mrxiaozhuox/dioxus-guide-cn","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mrxiaozhuox/dioxus-guide-cn","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrxiaozhuox%2Fdioxus-guide-cn","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrxiaozhuox%2Fdioxus-guide-cn/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrxiaozhuox%2Fdioxus-guide-cn/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrxiaozhuox%2Fdioxus-guide-cn/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mrxiaozhuox","download_url":"https://codeload.github.com/mrxiaozhuox/dioxus-guide-cn/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrxiaozhuox%2Fdioxus-guide-cn/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279000841,"owners_count":26082951,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-09T02:00:07.460Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dioxus","document"],"created_at":"2024-10-10T01:51:08.781Z","updated_at":"2025-10-09T06:40:04.803Z","avatar_url":"https://github.com/mrxiaozhuox.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 介绍 - Dioxus\n\n![DIOXUS_LOGO](https://dioxuslabs.com/guide/images/dioxuslogo_full.png)\n\n**Dioxus** 是一款用于构建跨平台用户界面的框架（生态系统），它使用 Rust 编程语言。\n这本指南将带领你学习并使用它。（我们会尝试在 网页端、移动端、桌面端 使用 Dixous 框架）\n\n- Dioxus 中文社区 [ QQ群 ]：863409183\n\n```rust\nfn App(cx: Scope) -\u003e Element {\n    let (count, set_count) = use_state(\u0026cx, || 0);\n\n    cx.render(rsx!(\n        h1 { \"High-Five counter: {count}\" }\n        button { onclick: move |_| set_count(count + 1), \"Up high!\" }\n        button { onclick: move |_| set_count(count - 1), \"Down low!\" }\n    ))\n};\n```\n\nDioxus 与 React 有许多的相似之处，如果本指南中有任何未阐述清楚的概念，你可以前往 React 文档中查询。\n我们致力于在 Rust 生态环境中构建一个令人熟悉的UI框架，如果你已经熟悉 React 了，那么 Dioxus 将对你来说非常的简单！\n（如果你是新手，这本指南同样适合你哦qwq）\n\n## 多平台\n\n`Dioxus` 是一个支持多平台的开发包，这意味着它的核心代码可以在任何平台下被使用。\n与许多其他 Rust 前端工具包不同，Dioxus 与 Web-Sys 并没有本质上的联系。\n事实上，每个元素和事件监听器都可以在编译时被更改。\n\n目前为止，我们拥有以下渲染器：\n\n- WebSys (为 WASM 提供)\n- Tao/Tokio (为桌面端提供)\n- Tao/Tokio (为移动端提供)\n- SSR (用于生成静态 SSR)\n- TUI/Rink (用于制作终端程序)\n\n### Web 支持\n\n网页端是 Dioxus 最为重要的支持平台，要想让你的项目能够在 Web 中运行，首先会将其编译为 **WebAssembly** 并启用 `Dioxus-Web` 功能。\nWASM 有很多系统限制，这导致你的代码不能包含任何原生的系统调用（计时器，IO 等）\n\n鉴于 Web 平台功能已经非常成熟了，所以说后期的 API 变化会很小。\n\n一些 Web 端的演示项目：\n\n- [TodoMVC](https://gitee.com/dioxus-cn/example-projects/tree/master/todomvc)\n- [ECommerce](https://gitee.com/dioxus-cn/example-projects/tree/master/ecommerce-site)\n\n![TODOMVC_IMG](https://gitee.com/dioxus-cn/example-projects/raw/master/todomvc/example.png)\n\n### SSR 支持\n\nDioxus 支持 SSR 的服务端渲染。\n\n为了从 WebServer 渲染到静态文件 `.html`，你需要确保在 Dioxus 功能中启用了 SSR 特性。\n\n```rust\nlet contents = dioxus::ssr::render_vdom(\u0026dom);\n```\n\n我们不认为 SSR API 在未来会有太大的变化。\n\n一些 SSR 端的演示项目：\n\n- [官方网站](https://github.com/dioxusLabs/docsite)\n\n\n### Desktop 支持\n\n桌面端也是 Dioxus 生态中非常强大的一项，但与 Web 端相比，它所能做的还远远不够。\n目前，桌面应用使用 WebView 库渲染，但你的 Rust 代码依然是在本地系统运行的。\n这意味着部分浏览器 API 并不可用，所以说它并不能完全支持 Web 的功能。\n但是原生的系统 API 则是可以使用的（类似于 Websockets、文件系统等 ）\n\n一些 Desktop 端的演示项目：\n\n- [文件浏览器](https://gitee.com/dioxus-cn/example-projects/tree/master/file-explorer)\n- [WiFi 扫描器](https://gitee.com/dioxus-cn/example-projects/blob/master/wifi-scanner)\n\n![FE_IMG](https://gitee.com/dioxus-cn/example-projects/raw/master/file-explorer/image.png)\n\n\n### Mobile 支持\n\n移动端是目前 Dioxus 最有待提升的一项，它现在非常有很多问题需要处理。\n移动端应用使用 WebView 渲染，这意味着动画、透明和本地小部件目前是无法实现的。\n此外，iOS 是目前唯一支持的移动平台。( Dioxus 使用的 Rust 窗口库- tao -目前不支持Android。)\n\n#### 什么样的情况下你可以选择使用 Dioxus 开发移动端：\n\n如果你不关心 原生App 中类似于动画、透明、小组件等功能，而仅仅是 渲染/处理 一些简单的数据。\n那么你可以尝试使用 `Dioxus-Mobile` （我们希望它在后续能不断完善，越做越好！）\n\n一些 Mobile 端的演示项目：\n\n- [Todo App](https://gitee.com/dioxus-cn/example-projects/blob/master/ios_demo)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrxiaozhuox%2Fdioxus-guide-cn","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmrxiaozhuox%2Fdioxus-guide-cn","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrxiaozhuox%2Fdioxus-guide-cn/lists"}