{"id":45198,"date":"2023-09-06T05:51:58","date_gmt":"2023-06-15T14:37:23","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/"},"modified":"2024-04-30T21:41:29","modified_gmt":"2024-04-30T13:41:29","slug":"45198-2","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/","title":{"rendered":""},"content":{"rendered":"

\u306f\u3058\u3081\u306b<\/h1>\n

\u3053\u308c\u306f \u682a\u5f0f\u4f1a\u793e RetailAI X Advent Calendar 2022 \u306e 9 \u65e5\u76ee\u306e\u8a18\u4e8b\u3067\u3059\u3002
\n\u524d\u56de\u306f ML\u30a8\u30f3\u30b8\u30cb\u30a2\u3067\u3042\u308b@atsukish\u3055\u3093\u306e\u3010MLOps\u3011Vertex AI\u306b\u3088\u308b\u30e2\u30c7\u30eb\u30e2\u30cb\u30bf\u30ea\u30f3\u30b0\u30b5\u30fc\u30d3\u30b9\u306e\u69cb\u7bc9\u3067\u3057\u305f\u3002<\/p>\n

\u672c\u65e5\u306f\u300cRust UI\u30e9\u30a4\u30d6\u30e9\u30ea\u300cDioxus\u300d\u3092React+Typescript\u3068\u6bd4\u8f03\u3057\u3066\u307f\u305f\u300d\u3067\u3059\u3002<\/p>\n

\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u79c1\u306f\u6700\u8fd1Rust\u306b\u8208\u5473\u3092\u6301\u3063\u3066\u3044\u308b\u306e\u3067\u3059\u304c\u3001\u81ea\u5206\u306e\u7279\u306b\u8208\u5473\u306e\u3042\u308b\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5206\u91ce\u3067\u5b66\u7fd2\u3067\u304d\u308b\u30e9\u30a4\u30d6\u30e9\u30ea\u7b49\u304c\u306a\u3044\u304b\u3068\u63a2\u3057\u3066\u3044\u305f\u3068\u3053\u308dDioxus\u3092\u898b\u3064\u3051\u307e\u3057\u305f\u3002
\nReact\u3092\u89e6\u3063\u305f\u3053\u3068\u304c\u3042\u308b\u65b9\u306a\u3089\u5272\u3068\u9055\u548c\u611f\u306a\u304fRust\u306e\u5b66\u7fd2\u304c\u3067\u304d\u308b\u306e\u3067\u306f\u306a\u3044\u304b\u3068\u601d\u3044\u307e\u3057\u305f\u306e\u3067\u5171\u6709\u3057\u307e\u3059\u3002<\/p>\n

Dioxus\u3068\u306f\uff1f<\/h2>\n

Dioxus\u306fRust\u3067GUI\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3092\u69cb\u7bc9\u3067\u304d\u308b\u30af\u30ec\u30fc\u30c8\uff08Rust\u306e\u4e16\u754c\u3067\u306f\u30e9\u30a4\u30d6\u30e9\u30ea\u3001\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306e\u3053\u3068\u3092\u30af\u30ec\u30fc\u30c8\u3068\u547c\u3073\u307e\u3059\uff09\u3067\u3059\u3002
\nReact\u30e9\u30a4\u30af\u306a\u6587\u6cd5\u3067\u8a18\u8ff0\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u3066\u3001
\n\u30fbWebAssembly
\n\u30fbDesktop
\n\u30fbMobile\uff08\u73fe\u5728iOS\u306e\u307f\uff1f\uff09
\n\u30fbTUI
\n\u306a\u3069\u3001\u69d8\u3005\u306a\u5f62\u3067\u51fa\u529b\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002
\n\u307e\u305f\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u3067
\n\u30fbRedux\u306e\u3088\u3046\u306a\u72b6\u614b\u7ba1\u7406\u6a5f\u80fd\uff08Fermi\uff09
\n\u30fb\u30eb\u30fc\u30c6\u30a3\u30f3\u30b0\u6a5f\u80fd\uff08Router\uff09
\n\u3082\u7d44\u307f\u8fbc\u307e\u308c\u3066\u3044\u308b\u305f\u3081\u3001\u767a\u5c55\u9014\u4e0a\u3067\u306f\u3042\u308a\u307e\u3059\u304c\u73fe\u72b6\u3067\u3082\u305d\u308c\u306a\u308a\u306e\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u306f\u69cb\u7bc9\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002
\n\u4eca\u56de\u306e\u8a18\u4e8b\u3067\u306fWebAssembly\u3092\u51fa\u529b\u3059\u308b\u65b9\u6cd5\u3092\u7d39\u4ecb\u3057\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n

Rust\u3001Dioxus\u306e\u5c0e\u5165<\/h2>\n

\uff11\u30fbrustup\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h3>\n

\u307e\u305arustup\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3057\u3087\u3046\u3002\u3053\u308c\u306b\u3088\u308a\u30b3\u30f3\u30d1\u30a4\u30e9\u3067\u3042\u308brustc,\u30d1\u30c3\u30b1\u30fc\u30b8\u30de\u30cd\u30fc\u30b8\u30e3\u306ecargo\u7b49\u306eRust\u958b\u767a\u306b\u5fc5\u8981\u306a\u30c4\u30fc\u30eb\u3092\u4e00\u5f8b\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002
\n\u4e0b\u8a18\u306e\u516c\u5f0f\u306e\u3084\u308a\u65b9\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n

 <\/p>\n

\u307e\u305f\u3001macOS\u306e\u5834\u5408\u306fhomebrew\u3067\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3082\u53ef\u80fd\u3067\u3059\u3002<\/p>\n

\/\/rustup\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\r\n<\/span>$<\/span> brew install <\/span>rustup-init\r\n$<\/span> rustup-init\r\n\/\/\u30b7\u30a7\u30eb\u306e\u518d\u8d77\u52d5\r\n<\/span>$<\/span> exec<\/span> $SHELL<\/span> -l<\/span>\r\n<\/code><\/pre>\n
\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u304c\u7d42\u308f\u3063\u305f\u3089\u5ff5\u306e\u70ba\u30d0\u30fc\u30b8\u30e7\u30f3\u78ba\u8a8d\u3092\u3057\u3066\u3001\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3055\u308c\u3066\u3044\u308b\u3053\u3068\u3092\u78ba\u8a8d\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n
\/\/rustc\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u78ba\u8a8d\r\n<\/span>$<\/span> rustc --version<\/span>\r\n\r\n><\/span>rustc 1.65.0 (<\/span>897e37553 2022-11-02)<\/span>\r\n\/\/cargo\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u78ba\u8a8d\r\n<\/span>$<\/span> cargo --version<\/span>\r\n\r\n><\/span>cargo 1.65.0 (<\/span>4bc8f24d3 2022-10-20)<\/span>\r\n<\/code><\/pre>\n
\uff12\u30fb\u5468\u8fba\u30c4\u30fc\u30eb\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb(Trunk,Cargo-edit\u7b49)<\/h3>\n
\u30fbTrunk<\/h4>\n
Trunk\u306fRust\u7528\u306eWebAssembly\u30d0\u30f3\u30c9\u30e9\u30fc\u3067\u3059\u3002\uff08JS\u3067\u3044\u3046Webpack,Vite\u306e\u3088\u3046\u306a\u3082\u306e\uff09
\nindex.html\u3092\u30a8\u30f3\u30c8\u30ea\u30fc\u30dd\u30a4\u30f3\u30c8\u3068\u3057\u3066\u3001WASM\uff08WebAssembly\u3002\u4ee5\u964dWASM\u3068\u547c\u3073\u307e\u3059\uff09\u3084\u753b\u50cf\u3001CSS\u3092\u307e\u3068\u3081\u3066\u304f\u308c\u308b\u3060\u3051\u3067\u306a\u304f\u3001\u30db\u30c3\u30c8\u30ea\u30ed\u30fc\u30c9\u6a5f\u80fd\u4ed8\u304d\u306e\u958b\u767a\u30b5\u30fc\u30d0\u30fc\u3092\u7acb\u3061\u4e0a\u3052\u3066\u304f\u308c\u307e\u3059\u3002
\n\u500b\u4eba\u7684\u306b\u73fe\u72b6\u3067\u306fWeb\u306e\u958b\u767a\u3092\u3059\u308b\u306b\u306fTrunk\u304c\u6700\u9069\u306a\u306e\u3067\u306f\u306a\u3044\u304b\u3068\u8003\u3048\u307e\u3059\u3002
\nTrunk\u306fcargo\u3092\u5229\u7528\u3057\u3066\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n
\/\/Trunk\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\r\n<\/span>$<\/span> cargo install <\/span>trunk\r\n<\/code><\/pre>\n
\u307e\u305f\u3001Rust\u30b3\u30fc\u30c9\u3092WebAssembly\u3092\u30b3\u30f3\u30d1\u30a4\u30eb\u3059\u308b\u305f\u3081\u306b\u3001Rust\u306b\u30b3\u30f3\u30d1\u30a4\u30eb\u30bf\u30fc\u30b2\u30c3\u30c8\u3092\u8ffd\u52a0\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002
\n\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n
$<\/span> rustup target add wasm32-unknown-unknown\r\n\r\n\/\/\u203bRust\u304c\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u308b\u30b3\u30f3\u30d1\u30a4\u30eb\u30bf\u30fc\u30b2\u30c3\u30c8\u306f\u4ee5\u4e0b\u306e\u30b3\u30de\u30f3\u30c9\u3067\u78ba\u8a8d\u3067\u304d\u308b\r\n<\/span>$<\/span> rustup target list\r\n\r\n><\/span>aarch64-apple-darwin\r\naarch64-apple-ios\r\naarch64-apple-ios-sim\r\naarch64-fuchsia\r\naarch64-linux-android\r\n\u7701\u7565...\r\n\r\n<\/span><\/code><\/pre>\n
\u30b3\u30f3\u30d1\u30a4\u30eb\u30bf\u30fc\u30b2\u30c3\u30c8\u306b\u95a2\u3059\u308b\u53c2\u8003\u8cc7\u6599<\/p>\n
\u30fbcargo-edit<\/h4>\n
Rust\u3067\u30af\u30ec\u30fc\u30c8\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u969b\u306fcargo.toml\u306b\u6307\u5b9a\u3057\u305f\u30af\u30ec\u30fc\u30c8\u3092\u8a18\u8ff0\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u304c\u3001\u90fd\u5ea6toml\u30d5\u30a1\u30a4\u30eb\u306b\u5165\u529b\u3059\u308b\u306e\u306f\u9762\u5012\u3060\u3063\u305f\u308a\u3057\u307e\u3059\u3002
\ncargo-edit\u306fcargo add {\u30af\u30ec\u30fc\u30c8\u540d}\u3068\u30b3\u30de\u30f3\u30c9\u540d\u3092\u5165\u529b\u3059\u308b\u3053\u3068\u3067toml\u30d5\u30a1\u30a4\u30eb\u306b\u30af\u30ec\u30fc\u30c8\u306e\u60c5\u5831\u3092\u5165\u529b\u3057\u3066\u304f\u308c\u308b\u305f\u3081\u4fbf\u5229\u3067\u3059\u3002\uff08JS\u306enpm install,yarn add\u307f\u305f\u3044\u306a\u3082\u306e\uff09
\n\u307e\u305f\u3001\u30af\u30ec\u30fc\u30c8\u306b\u3088\u3063\u3066\u306f\u4f7f\u3044\u305f\u3044\u6a5f\u80fd\u3092features\u3068\u3057\u3066\u6307\u5b9a\u3059\u308b\u5fc5\u8981\u304c\u3042\u3063\u305f\u308a\u3059\u308b\u306e\u3067\u3059\u304c\u3001cargo-edit\u3067\u306fcargo add {\u30af\u30ec\u30fc\u30c8\u540d} –features {\u6a5f\u80fd\u540d}\u3067\u5165\u529b\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n
\uff13\u30fbVSCode\u62e1\u5f35\u6a5f\u80fd\u306e\u5c0e\u5165<\/h3>\n
rust-analyzer<\/h4>\n
rust-analyzer\u306fRust\u30b3\u30fc\u30c9\u306e\u578b\u3084\u672a\u4f7f\u7528\u95a2\u6570\u7b49\u306e\u30c1\u30a7\u30c3\u30af\u3001\u578b\u63a8\u8ad6\u7b49\u3092\u304a\u3053\u306a\u3063\u3066\u304f\u308c\u308bVSCode\u62e1\u5f35\u6a5f\u80fd\u3067\u3059\u3002
\n\u901a\u5e38\u3067\u3059\u3068cargo run\u30b3\u30de\u30f3\u30c9\u3092\u5b9f\u884c\u3057\u306a\u3051\u308c\u3070\u308f\u304b\u3089\u306a\u3044\u30a8\u30e9\u30fc\u7b49\u304cVSCode\u4e0a\u3067\u8996\u899a\u7684\u306b\u308f\u304b\u308b\u3088\u3046\u306b\u306a\u308a\u3001\u3053\u308c\u304c\u3042\u308b\u3068\u306a\u3044\u3068\u3067\u306f\u958b\u767a\u52b9\u7387\u304c\u5168\u7136\u9055\u3046\u3068\u601d\u3044\u307e\u3059\u306e\u3067\u3001\u305c\u3072\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u3092\u304a\u52e7\u3081\u3057\u307e\u3059\u3002<\/p>\n
BetterToml<\/h4>\n
Better-Toml\u306ftoml\u30d5\u30a1\u30a4\u30eb\u306e\u30b7\u30f3\u30bf\u30c3\u30af\u30b9\u30cf\u30a4\u30e9\u30a4\u30c8\u7b49\u3092\u884c\u306a\u3063\u3066\u304f\u308c\u308b\u62e1\u5f35\u6a5f\u80fd\u3067\u3059\u3002
\ntoml\u30d5\u30a1\u30a4\u30eb\u3092\u7de8\u96c6\u3057\u305f\u3044\u6642\u306b\u4fbf\u5229\u306a\u306e\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u3092\u304a\u52e7\u3081\u3057\u307e\u3059\u3002<\/p>\n
crates<\/h4>\n
crates\u306ftoml\u30d5\u30a1\u30a4\u30eb\u306b\u3042\u308b\u30af\u30ec\u30fc\u30c8\u306e\u4f9d\u5b58\u95a2\u4fc2\u3092\u7ba1\u7406\u3059\u308b\u305f\u3081\u306e\u62e1\u5f35\u6a5f\u80fd\u3067\u3059\u3002
\n\u30af\u30ec\u30fc\u30c8\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u304c\u6700\u65b0\u304b\u3069\u3046\u304b\u306f\u4eca\u307e\u3067\u306fcrates.io\u3092\u78ba\u8a8d\u3057\u306a\u3051\u308c\u3070\u3044\u3051\u306a\u304b\u3063\u305f\u306e\u3067\u3059\u304c\u3001\u3053\u306e\u62e1\u5f35\u6a5f\u80fd\u306ftoml\u30d5\u30a1\u30a4\u30eb\u4e0a\u3067\u30af\u30ec\u30fc\u30c8\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u78ba\u8a8d\u3057\u305f\u308a\u3001\u30bb\u30ec\u30af\u30c8\u30dc\u30c3\u30af\u30b9\u3067\u30d0\u30fc\u30b8\u30e7\u30f3\u3092\u5909\u66f4\u3057\u305f\u308a\u3067\u304d\u307e\u3059\u3002
\n\u3053\u308c\u3082\u975e\u5e38\u306b\u4fbf\u5229\u3060\u3068\u601d\u3046\u306e\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u3092\u304a\u52e7\u3081\u3057\u307e\u3059\u3002<\/p>\n
TailwindCSS IntelliSense<\/h4>\n
TailwindCSS IntelliSense\u306f\u3001TailwindCSS\u306e\u30af\u30e9\u30b9\u540d\u306e\u88dc\u5b8c\u3092\u3057\u3066\u304f\u308c\u308b\u62e1\u5f35\u6a5f\u80fd\u3067\u3059\u3002\u3059\u3067\u306b\u7528\u610f\u3055\u308c\u3066\u3042\u308b\u30af\u30e9\u30b9\u306e\u4ed6\u3001tailfind.config.js\u3067\u5b9a\u7fa9\u3057\u305f\u30af\u30e9\u30b9\u306e\u88dc\u5b8c\u3082\u3057\u3066\u304f\u308c\u307e\u3059\u3002
\nTailwindCSS\u3092\u4f7f\u7528\u3059\u308b\u5834\u5408\u3001\u3053\u306e\u62e1\u5f35\u6a5f\u80fd\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3053\u3068\u3092\u304a\u52e7\u3081\u3057\u307e\u3059\u3002<\/p>\n
\uff14\u30fb\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u4f5c\u6210\u3001Dioxus\u306e\u5c0e\u5165<\/h3>\n
\u305d\u308c\u3067\u306f\u65b0\u3057\u304fDioxus\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002cargo new {\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u540d}\u3067\u4f5c\u6210\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002
\n\u305d\u306e\u5f8c\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u79fb\u52d5\u3057\u3001Dioxus\u3092cargo-edit\u3092\u7528\u3044\u3066\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n
\/\/cargo\u3092\u4f7f\u7528\u3057\u3066\u65b0\u3057\u3044Rust\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\r\n<\/span>$<\/span>cargo new {<\/span>\u4efb\u610f\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u540d}<\/span>\r\n\r\n$<\/span>cd<\/span> {<\/span>\u4efb\u610f\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u540d}<\/span>\r\n\r\n\/\/Dioxus\u3092features\u3092\u300cWeb\u300d\u306b\u6307\u5b9a\u3057\u3066\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\r\n<\/span>$<\/span> cargo add dioxus --features<\/span> web\r\n<\/code><\/pre>\n
\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u305f\u3089\u3001\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30eb\u30fc\u30c8\u306bTrunk\u306e\u30a8\u30f3\u30c8\u30ea\u30fc\u30dd\u30a4\u30f3\u30c8\u306b\u306a\u308bindex.html\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n
<!DOCTYPE html><\/span>\r\n<html<\/span> lang=<\/span>\"ja\"<\/span>><\/span>\r\n  <head><\/span>\r\n    <meta<\/span> http-equiv=<\/span>\"Content-Type\"<\/span> content=<\/span>\"text\/html; charset=utf-8\"<\/span> \/><\/span>\r\n    <meta<\/span> charset=<\/span>\"UTF-8\"<\/span> \/><\/span>\r\n    <meta<\/span> name=<\/span>\"viewport\"<\/span> content=<\/span>\"width=device-width, initial-scale=1.0\"<\/span> \/><\/span>\r\n  <\/head><\/span>\r\n  <body><\/span>\r\n    <div<\/span> id=<\/span>\"main\"<\/span>><\/div><\/span>\r\n  <\/body><\/span>\r\n<\/html><\/span>\r\n\r\n<\/code><\/pre>\n
\u6b21\u306bmain.rs\u30d5\u30a1\u30a4\u30eb\u306bDioxus\u306e\u30b3\u30fc\u30c9\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n
use<\/span> dioxus<\/span>::<\/span>prelude<\/span>::<\/span>*<\/span>;<\/span>\r\n\r\nfn<\/span> main<\/span>()<\/span> {<\/span>\r\n    dioxus<\/span>::<\/span>web<\/span>::<\/span>launch<\/span>(<\/span>app<\/span>);<\/span>\r\n}<\/span>\r\n\r\nfn<\/span> app<\/span>(<\/span>cx<\/span>:<\/span> Scope<\/span>)<\/span> -><\/span> Element<\/span> {<\/span>\r\n    cx<\/span>.render<\/span>(<\/span>rsx!<\/span> (<\/span>\r\n        div<\/span> {<\/span> \"Hello, world!\"<\/span> }<\/span>\r\n    ))<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
\u3042\u3068\u306ftrunk serve\u30b3\u30de\u30f3\u30c9\u3092\u5165\u529b\u3057\u3066\u30ed\u30fc\u30ab\u30eb\u30b5\u30fc\u30d0\u30fc\u3092\u8d77\u52d5\u3055\u305b\u3001\u30d6\u30e9\u30a6\u30b6\u3092\u958b\u304dlocalhost:8080\u304c\u958b\u3051\u308c\u3070OK\u3067\u3059\u3002<\/p>\n
\uff15\u30fbTailwindCSS\u306e\u5c0e\u5165\uff08\u304a\u597d\u307f\u3067\uff09<\/h3>\n
Dioxus\u306b\u306fTailwindCSS\u3092\u5c0e\u5165\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002
\n\u3053\u3061\u3089\u306e\u8a18\u4e8b\u304c\u53c2\u8003\u306b\u306a\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002
\n\u2191\u306e\u8a18\u4e8b\u306b\u88dc\u8db3\u3059\u308b\u3068\u3001\u3053\u306e\u307e\u307e\u3067\u306fTailwindCSS\u306e\u30a4\u30f3\u30c6\u30ea\u30bb\u30f3\u30b9\u304c\u52b9\u304b\u306a\u3044\u306e\u3067\u3001Rust\u30b3\u30fc\u30c9\u4e0a\u3067TailwindCSS\u306e\u30a4\u30f3\u30c6\u30ea\u30bb\u30f3\u30b9\u304c\u52b9\u304f\u3088\u3046\u306b\u8a2d\u5b9a\u3092\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002\u4ee5\u4e0b\u306e\u8a2d\u5b9a\u3092settings.json\u306b\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n
\u3000\u3000<\/span>\/\/\u300cclass: \"\"\u300d\u3068\u3044\u3046\u69cb\u6587\u3067\u3082TailwindCSS\u306e\u30a4\u30f3\u30c6\u30ea\u30bb\u30f3\u30b9\u304c\u52b9\u304f\u3088\u3046\u306b\u3059\u308b<\/span>\r\n \"<\/span>tailwindCSS.experimental.classRegex<\/span>\"<\/span>:<\/span> [<\/span>\"<\/span>class:<\/span>\\\\<\/span>s*<\/span>\\\"<\/span>([^<\/span>\\\"<\/span>]*)<\/span>\\\"<\/span>\"<\/span>],<\/span>\r\n \/\/.rs\u30d5\u30a1\u30a4\u30eb\u3082html\u3068\u307f\u306a\u3057\u3001\u30a4\u30f3\u30c6\u30ea\u30bb\u30f3\u30b9\u306e\u5bfe\u8c61\u3068\u3059\u308b<\/span>\r\n \"<\/span>tailwindCSS.includeLanguages<\/span>\"<\/span>:<\/span> {<\/span>\r\n    \"<\/span>rust<\/span>\"<\/span>:<\/span> \"<\/span>html<\/span>\"<\/span>,<\/span>\r\n    \"<\/span>*.rs<\/span>\"<\/span>:<\/span> \"<\/span>html<\/span>\"<\/span>\r\n  }<\/span>\r\n<\/code><\/pre>\n
\"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8<\/div>\n
React\u3068\u306e\u6bd4\u8f03<\/h2>\n
\uff11\u30fb\u95a2\u6570\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u4f5c\u6210<\/h3>\n
React<\/h4>\n
export<\/span> const<\/span> Sample<\/span> =<\/span> ()<\/span> =><\/span> {<\/span>\r\n    return <\/span>(<\/span>\r\n        <<\/span>div<\/span>><\/span>hello world<\/<\/span>div<\/span>><\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
Dioxus<\/h4>\n
Dioxus\u306frsx!\u30de\u30af\u30ed\u3092\u4f7f\u7528\u3057\u3066\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n
use<\/span> dioxus<\/span>::<\/span>prelude<\/span>::<\/span>*<\/span>;<\/span>\r\n\r\n#[allow(non_snake_case)]<\/span>\r\npub<\/span> fn<\/span> Sample<\/span>(<\/span>cx<\/span>:<\/span> Scope<\/span>)<\/span> -><\/span> Element<\/span> {<\/span>\r\n    cx<\/span>.render<\/span>(<\/span>rsx!<\/span> {<\/span>\r\n            div<\/span> {<\/span>\r\n                \"hello world\"<\/span>\r\n            }<\/span>\r\n        }<\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
#[allow(non_snake_case)]\u3068\u3057\u3066\u3044\u308b\u306e\u306f\u3001\u30d1\u30b9\u30ab\u30eb\u30b1\u30fc\u30b9\u3067\u95a2\u6570\u3092\u5b9a\u7fa9\u3059\u308b\u3068rust-analyzer\u3067\u8b66\u544a\u304c\u767a\u751f\u3057\u3066\u3057\u307e\u3046\u306e\u3067\u8a18\u8ff0\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n
\uff12\u30fbProps\u306e\u5b9a\u7fa9\u3001\u6e21\u3057\u65b9<\/h3>\n
React<\/h4>\n
type<\/span> Props<\/span> {<\/span>\r\n    text<\/span>:<\/span> string<\/span>\r\n}<\/span>\r\n\r\nexport<\/span> const<\/span> sample<\/span> =<\/span> ({<\/span>text<\/span>}:<\/span> Props<\/span>)<\/span> =><\/span> {<\/span>\r\n    return <\/span>(<\/span>\r\n        <<\/span>div<\/span>><\/span>{<\/span>text<\/span>}<\/span><\/<\/span>div<\/span>><\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
Dioxus<\/h4>\n
Dioxus\u3067Props\u3092\u5b9a\u7fa9\u3059\u308b\u65b9\u6cd5\u3068\u3057\u3066
\n\u30fb\u69cb\u9020\u4f53\uff08Struct\uff09\u3092\u4f7f\u7528\u3057\u3066\u5b9a\u7fa9\u3059\u308b\u65b9\u6cd5
\n\u30fbinline_props\u30de\u30af\u30ed\u3092\u4f7f\u7528\u3057\u3066\u5b9a\u7fa9\u3059\u308b\u65b9\u6cd5
\n\u306e\u4e8c\u7a2e\u985e\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n
\/\/\u69cb\u9020\u4f53\u3092\u4f7f\u7528\u3057\u3066\u5b9a\u7fa9\u3059\u308b\u65b9\u6cd5<\/span>\r\n#[derive(Props,<\/span> PartialEq)]<\/span>\r\npub<\/span> struct<\/span> Props<\/span> {<\/span>\r\n    text<\/span>:<\/span> String<\/span>,<\/span>\r\n}<\/span>\r\n\r\n#[allow(non_snake_case)]<\/span>\r\npub<\/span> fn<\/span> Sample<\/span>(<\/span>cx<\/span>:<\/span> Scope<\/span><<\/span>Props<\/span>><\/span>)<\/span> -><\/span> Element<\/span> {<\/span>\r\n    cx<\/span>.render<\/span>(<\/span>rsx!<\/span> {<\/span>\r\n        div<\/span> {<\/span> \"{cx.props.text}\"<\/span> }<\/span>\r\n    })<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
\/\/inline_props\u30de\u30af\u30ed\u3092\u4f7f\u7528\u3057\u3066\u5b9a\u7fa9\u3059\u308b\u65b9\u6cd5<\/span>\r\n#[allow(non_snake_case)]<\/span>\r\n#[inline_props]<\/span>\r\npub<\/span> fn<\/span> Sample<\/span>(<\/span>cx<\/span>:<\/span> Scope<\/span>,<\/span> text<\/span>:<\/span> String<\/span>)<\/span> -><\/span> Element<\/span> {<\/span>\r\n    cx<\/span>.render<\/span>(<\/span>rsx!<\/span> {<\/span>\r\n        div<\/span> {<\/span> \"{text}\"<\/span> }<\/span>\r\n    })<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
\u69cb\u9020\u4f53\u3092\u7528\u3044\u308b\u65b9\u6cd5\u306fReact+Typescript\u3068\u540c\u3058\u3088\u3046\u306a\u611f\u3058\u3067\u99b4\u67d3\u307f\u304c\u3042\u308b\u306e\u3067\u306f\u306a\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002
\ninline_props\u30de\u30af\u30ed\u3092\u7528\u3044\u308b\u65b9\u6cd5\u306f\u69cb\u9020\u4f53\u3092\u7528\u3044\u308b\u65b9\u6cd5\u3088\u308a\u3082\u30b9\u30c3\u30ad\u30ea\u3068\u8a18\u8ff0\u3067\u304d\u308b\u306e\u304c\u7279\u5fb4\u3067\u3059\u3002
\n\u57fa\u672cinline_props\u3092\u7528\u3044\u308b\u65b9\u6cd5\u3067\u554f\u984c\u306a\u3044\u304b\u3068\u306f\u601d\u3044\u307e\u3059\u304c\u3001\u516c\u5f0f\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u306b\u3088\u308b\u3068\u3001\u300cProp\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8\u3092\u5236\u5fa1\u3067\u304d\u306a\u3044\u53ef\u80fd\u6027\u304c\u3042\u308b\u306e\u3067\u3001\u30e9\u30a4\u30d6\u30e9\u30ea\u306e\u4f5c\u8005\u306f\u3053\u308c\u3092\u4f7f\u7528\u3057\u306a\u3044\u3067\u304f\u3060\u3055\u3044\u300d\u3068\u306e\u3053\u3068\u3067\u3057\u305f\u3002<\/p>\n
\uff13\u30fbState\u7ba1\u7406\u3001Hooks<\/h3>\n
useState<\/h4>\n
react<\/h4>\n
export<\/span> const<\/span> sample<\/span> =<\/span> ()<\/span> =><\/span> {<\/span>\r\n    const<\/span> [<\/span>value<\/span>,<\/span> setValue<\/span>]<\/span> =<\/span> useState<\/span>(<\/span>\"\"<\/span>)<\/span>\r\n    \r\n    return <\/span>(<\/span>\r\n        <><\/span>\r\n            <<\/span>div<\/span>><\/span>{<\/span>value<\/span>}<\/span><\/<\/span>div<\/span>><\/span>\r\n            <<\/span>button<\/span> onClick<\/span>=<\/span>{<\/span>()<\/span> =><\/span> setValue<\/span>(<\/span>\"<\/span>sample<\/span>\"<\/span>)<\/span>}<\/span>><\/span>button<\/<\/span>button<\/span>><\/span>      \r\n        <\/><\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
Dioxus<\/h4>\n
pub<\/span> fn<\/span> sample<\/span>(<\/span>cx<\/span>:<\/span> Scope<\/span>)<\/span> -><\/span> Element<\/span> {<\/span>\r\n    let<\/span> value<\/span> =<\/span> use_state<\/span>(<\/span>&<\/span>cx<\/span>,<\/span> ||<\/span> \"\"<\/span>)<\/span>\r\n\r\n    cx<\/span>.render<\/span>(<\/span>rsx!<\/span>(<\/span>\r\n        button<\/span> {<\/span> \r\n            onclick<\/span>:<\/span> move<\/span> |<\/span>_<\/span>|<\/span> value<\/span>.set<\/span>(<\/span>\"sample\"<\/span>),<\/span> \r\n            \"button\"<\/span>\r\n        }<\/span>\r\n    ))<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
Dioxus\u306fHooks\u3092\u5b9a\u7fa9\u3059\u308b\u969b\u306b\u306fSetter\u306f\u66f8\u304b\u306a\u3044\u3088\u3046\u3067\u3059\u3002<\/p>\n
\uff14\u30fb\u6f14\u7b97\u5b50<\/h3>\n
React(TS,JS)\u3067\u306f&&\u3084\u4e09\u9805\u6f14\u7b97\u5b50\u7b49\u306e\u6f14\u7b97\u5b50\u3092\u7528\u3044\u3066\u5b9f\u88c5\u3059\u308b\u3053\u3068\u304c\u3042\u308b\u3068\u601d\u3044\u307e\u3059\u304c\u3001React\u306e\u6f14\u7b97\u5b50\u3092\u7528\u3044\u305f\u5b9f\u88c5\u6cd5\u3092Dioxus\u3067\u306f\u3069\u3046\u3084\u3063\u3066\u5b9f\u88c5\u3059\u308b\u306e\u304b\u7d39\u4ecb\u3057\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002(\u4ee5\u4e0b\u306e\u4f8b\u304b\u3089\u306f\u5916\u5074\u306e\u95a2\u6570\u5ba3\u8a00\u306e\u30b3\u30fc\u30c9\u7b49\u3092\u7701\u7565\u3057\u305f\u72b6\u614b\u3067\u66f8\u304d\u307e\u3059\u306e\u3067\u3001\u3054\u4e86\u627f\u304f\u3060\u3055\u3044\u3002)<\/p>\n
&&<\/h4>\n
React\u3067\u306f\u7d50\u69cb\u51fa\u3066\u304f\u308b\u3068\u601d\u3044\u307e\u3059\u304c\u3001\u5de6\u8fba\u306e\u6761\u4ef6\u3092\u6e80\u305f\u3059\u6642\u306b\u53f3\u8fba\u306e\u51e6\u7406\u3092\u5b9f\u884c\u3059\u308b\u6f14\u7b97\u5b50\u3067\u3059\u3002<\/p>\n
\/\/isOpen\u304ctrue\u306e\u6642\u306bdiv\u30bf\u30b0\u3092\u8868\u793a\u3059\u308b<\/span>\r\n\r\nconst<\/span> isOpen<\/span> =<\/span> true<\/span>\r\n\r\nreturn <\/span>(<\/span>\r\n    isOpen<\/span> &&<\/span> {<\/span> <<\/span>div<\/span>><\/span>open<\/span>!<\/span><<\/span>\/<\/span>div<\/span>><\/span> }\r\n)\r\n<\/code><\/pre>\n
Dioxus\u3060\u3068\u3053\u3093\u306a\u611f\u3058\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n
let<\/span> is_open<\/span> =<\/span> true<\/span>;<\/span>\r\n\r\nis_open<\/span>.then<\/span>(||<\/span> rsx!<\/span>(<\/span>\r\n    div<\/span> {<\/span>\r\n        \"open!\"<\/span>\r\n    }<\/span>\r\n))<\/span>\r\n<\/code><\/pre>\n
\u4e09\u9805\u6f14\u7b97\u5b50<\/h4>\n
react<\/h4>\n
const<\/span> hello<\/span> =<\/span> \"<\/span>world<\/span>\"<\/span>\r\n\r\nreturn <\/span>(<\/span>\r\n    {<\/span>hello<\/span> ===<\/span> \"<\/span>world<\/span>\"<\/span> ?<\/span> <<\/span>div<\/span>><\/span>variable is world<\/<\/span>div<\/span>><\/span> :<\/span> <<\/span>div<\/span>><\/span>other<\/<\/span>div<\/span>>}<\/span>\r\n)<\/span>\r\n<\/code><\/pre>\n
Dioxus<\/h4>\n
Rust\u3067\u306f\u4e09\u9805\u6f14\u7b97\u5b50\u304c\u3042\u308a\u307e\u305b\u3093\u3002\u305d\u306e\u305f\u3081if\u5f0f\uff08Rust\u306eif\u306f\u6587\u3067\u306f\u306a\u304f\u5f0f\u3067\u3059\uff09\u3067\u540c\u7b49\u306e\u6a5f\u80fd\u304c\u5b9f\u88c5\u3067\u304d\u307e\u3059\u3002<\/p>\n
let<\/span> hello<\/span> =<\/span> \"world\"<\/span>;<\/span>\r\n\r\nif<\/span> hello<\/span> ==<\/span> \"world\"<\/span> {<\/span>\r\n    rsx!<\/span>(<\/span>\r\n      div<\/span> {<\/span>\r\n          \"variable is world\"<\/span>\r\n      }<\/span>\r\n    )<\/span>\r\n}<\/span> else<\/span> {<\/span>\r\n    rsx!<\/span>(<\/span>\r\n        div<\/span> {<\/span>\r\n            \"other\"<\/span>\r\n        }<\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
\u307e\u305f\u6761\u4ef6\u5206\u5c90\u304c\u591a\u5c90\u306b\u6e21\u308b\u5834\u5408\u306f\u3001TS\/JS\u306e\u6a19\u6e96\u6a5f\u80fd\u306b\u306f\u306a\u3044\uff08ts-pattern\u306e\u3088\u3046\u306a\u30e9\u30a4\u30d6\u30e9\u30ea\u3067\u4ee3\u66ff\u306f\u3067\u304d\u307e\u3059\u304c\uff09Rust\u306e\u6a5f\u80fd\u3068\u3057\u3066match\u5f0f\u304c\u4f7f\u3048\u308b\u3068\u601d\u3044\u307e\u3059\u3002
\n\u53ef\u8aad\u6027\u3082\u826f\u304f\u3001\u500b\u4eba\u7684\u306b\u304a\u3059\u3059\u3081\u3067\u3059\u3002<\/p>\n
let<\/span> hello<\/span> =<\/span> \"world\"<\/span>;<\/span>\r\n\r\nmatch<\/span> hello<\/span> {<\/span>\r\n    \"world\"<\/span> =><\/span> rsx!<\/span>(<\/span>\r\n        div<\/span> {<\/span>\r\n            \"hello world\"<\/span>\r\n        }<\/span>\r\n    ),<\/span>\r\n    \"guys\"<\/span> =><\/span> rsx!<\/span>(<\/span>\r\n        div<\/span> {<\/span>\r\n            \"hello guys\"<\/span>\r\n        }<\/span>\r\n    ),<\/span>\r\n    \/\/\u300c\u3000_\u3000\u300d\u306f\u305d\u308c\u4ee5\u5916\u306e\u6761\u4ef6\u306e\u5834\u5408<\/span>\r\n    _<\/span> =><\/span> rsx!<\/span>(<\/span>\r\n        div<\/span> {<\/span>\r\n            \"other\"<\/span>\r\n        }<\/span>\r\n    )<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
React\u306b\u6163\u308c\u3066\u3044\u308b\u3068\u6238\u60d1\u3046\u304b\u3082\u3057\u308c\u306a\u3044Rust\u306e\u6a5f\u80fd<\/h2>\n
\uff11\u30fb\u6240\u6709\u6a29<\/h3>\n
\u307e\u305a\u7b2c\u4e00\u306b\u6240\u6709\u6a29\u304c\u6319\u3052\u3089\u308c\u308b\u3068\u601d\u3044\u307e\u3059\u3002
\nRust\u306fGC\u304c\u306a\u3044\u305f\u3081\u3001\u57fa\u672c\u7684\u306blet\u3067\u5ba3\u8a00\u3057\u305f\u5909\u6570\u306f\u30b9\u30b3\u30fc\u30d7\u304b\u3089\u5916\u308c\u308b\u3068\u7834\u68c4\u3055\u308c\u307e\u3059\u3002
\nReact\u3068\u9055\u3063\u3066\u5909\u6570\u306e\u5b9a\u7fa9\u306e\u4ed5\u65b9\u306f\u3082\u3061\u308d\u3093\u3001\u5909\u6570\u3092\u4f7f\u7528\u3059\u308b\u969b\u3082\u305d\u306e\u307e\u307e\u4f7f\u3046\u306e\u304b\u3001\u4e0d\u5909\u53c2\u7167(&\u3092\u3064\u3051\u308b\u3002\u2191\u3067\u3082useState\u306e\u30bb\u30af\u30b7\u30e7\u30f3\u3067\u884c\u306a\u3063\u3066\u3044\u307e\u3059)\u306b\u3059\u308b\u304b\u3001\u53ef\u5909\u53c2\u7167(&mut\u3092\u3064\u3051\u308b)\u306b\u3059\u308b\u304b\u7b49\u306b\u6c17\u3092\u914d\u308b\u5fc5\u8981\u304c\u51fa\u3066\u304d\u307e\u3059\u3002<\/p>\n
\uff12\u30fb\u30e2\u30b8\u30e5\u30fc\u30eb\u5ba3\u8a00\u3001\u30a4\u30f3\u30dd\u30fc\u30c8\u306e\u65b9\u6cd5<\/h3>\n
React\u306e\u5834\u5408\u306f\u30e2\u30b8\u30e5\u30fc\u30eb\u306e\u30a4\u30f3\u30dd\u30fc\u30c8\u306f\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3057\u3066\u884c\u3044\u307e\u3059\u3002<\/p>\n
\/\/default export\uff0b\u7d76\u5bfe\u30d1\u30b9\u306e\u5834\u5408<\/span>\r\nimport<\/span> Sample<\/span> from<\/span> '<\/span>src\/components\/Sample<\/span>'<\/span>\r\n\/\/named export\u306e\uff0b\u76f8\u5bfe\u30d1\u30b9\u306e\u5834\u5408<\/span>\r\nimport<\/span> {<\/span> Sample<\/span> }<\/span> from<\/span> '<\/span>.\/components\/Sample<\/span>'<\/span>\r\n<\/code><\/pre>\n
Rust\u306e\u5834\u5408\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u30a4\u30f3\u30dd\u30fc\u30c8\u3059\u308b\u969b\u306f\u3001\u57fa\u672c\u7684\u306b<\/p>\n
    \n
  1. \n
      \u30e2\u30b8\u30e5\u30fc\u30eb\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u3092\u7f6e\u3044\u3066\u3001\u305d\u306e{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u5185\u3067\u4f5c\u6210\u3057\u3066\u3042\u308b\u30e2\u30b8\u30e5\u30fc\u30eb\u3001\u30d5\u30a1\u30a4\u30eb\u3092pub mod\u3000{\u30d5\u30a1\u30a4\u30eb\u540d}\u3067\u516c\u958b\u3059\u308b<\/ol>\n<\/li>\n<\/ol>\n
      main.rs\u307e\u305f\u306flib.rs\u306b\u540c\u968e\u5c64\u306b\u3042\u308b\u30e2\u30b8\u30e5\u30fc\u30eb\u3092mod {\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}\u3067\u4f7f\u7528\u3059\u308b<\/p>\n
      use crate::{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d},use super::{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}\u7b49\u3067\u30a4\u30f3\u30dd\u30fc\u30c8\u3059\u308b<\/p>\n
      \u3068\u3044\u3046\u624b\u9806\u3092\u8e0f\u3080\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002
      \n\u8a00\u8449\u306b\u3059\u308b\u3068\u8a33\u304c\u308f\u304b\u3089\u306a\u3044\u3068\u601d\u3046\u306e\u3067\u4ee5\u4e0b\u306e\u56f3\u306e\u3088\u3046\u306a\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u69cb\u6210\u306e\u5834\u5408\u306e\u3084\u308a\u65b9\u3092\u8aac\u660e\u3057\u307e\u3059\u3002<\/p>\n
      src\r\n \u2523components\r\n \u2503     \u2523atoms\r\n \u2503     \u2503   \u2523AtomsSampleA.rs\r\n \u2503     \u2503   \u2517AromsSampleB.rs\r\n \u2503     \u2523molecules\r\n \u2503     \u2503   \u2517MoleculesSample.rs\r\n \u2503     \u2523organisms\r\n \u2503     \u2503   \u2517OrganismsSample.rs\r\n \u2503     \u2503\r\n \u2503     \u2523aroms.rs\u3000\u2190\u30e2\u30b8\u30e5\u30fc\u30eb\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u3092\u7f6e\u304f\r\n \u2503\u3000\u3000\u3000\u2523molecules.rs\u3000\u2190\u30e2\u30b8\u30e5\u30fc\u30eb\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u3092\u7f6e\u304f\r\n \u2503\u3000\u3000\u3000\u2517organisms.rs\u3000\u2190\u30e2\u30b8\u30e5\u30fc\u30eb\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u3092\u7f6e\u304f\r\n \u2503\r\n \u2523components.rs\u3000\u2190\u30e2\u30b8\u30e5\u30fc\u30eb\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u30d5\u30a1\u30a4\u30eb\u3092\u7f6e\u304f\r\n \u2517main.rs\r\n<\/code><\/pre>\n
      src\u914d\u4e0b\u306e\u968e\u5c64\u306b\u306f\u300ccomponents\u300d\u30e2\u30b8\u30e5\u30fc\u30eb\u304c\u3042\u308b\u305f\u3081\u3001\u540c\u968e\u5c64\u306b\u300ccomponents.rs\u300d\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002
      \ncomponents\u914d\u4e0b\u306e\u968e\u5c64\u306b\u306f\u300catoms\u300d\u300cmolecules\u300d\u300corganisms\u300d\u304c\u3042\u308b\u305f\u3081\u3001\u540c\u968e\u5c64\u306b\u300catoms.rs\u300d\u300cmolecules.rs\u300d\u300corganisms.rs\u300d\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002
      \n\u6b21\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u3067\u3001\u5404\u30e2\u30b8\u30e5\u30fc\u30eb\u5185\u306b\u3042\u308b\u30e2\u30b8\u30e5\u30fc\u30eb\u3001\u30d5\u30a1\u30a4\u30eb\u3092\u516c\u958b\u3057\u307e\u3059\u3002
      \ncomponents.rs\u306e\u5834\u5408\u306f\u3053\u3046\u306a\u308a\u307e\u3059\u3002<\/p>\n
      pub<\/span> mod<\/span> aroms<\/span>;<\/span>\r\npub<\/span> mod<\/span> molecules<\/span>;<\/span>\r\npub<\/span> mod<\/span> organisms<\/span>;<\/span>\r\n<\/code><\/pre>\n
      aroms.rs\u306e\u5834\u5408\u306f\u3053\u3046\u306a\u308a\u307e\u3059\u3002<\/p>\n
      \/\/\u2193\u30d1\u30b9\u30ab\u30eb\u30b1\u30fc\u30b9\u3067\u8a18\u8ff0\u3057\u3066\u3044\u308b\u306e\u3067\u3053\u308c\u3092\u8a18\u8ff0\u3057\u3066\u3044\u307e\u3059\u304c\u3001\u30b9\u30cd\u30fc\u30af\u30b1\u30fc\u30b9\u3067\u8a18\u8ff0\u3057\u3066\u3044\u308b\u5834\u5408\u306f\u5fc5\u8981\u3042\u308a\u307e\u305b\u3093<\/span>\r\n#![allow(non_snake_case)]<\/span>\r\npub<\/span> mod<\/span> AtomsSampleA<\/span>;<\/span>\r\npub<\/span> mod<\/span> AtomsSampleB<\/span>;<\/span>\r\n<\/code><\/pre>\n
      \u540c\u69d8\u306bmolecules.rs,organisms.rs\u3082\u81ea\u30e2\u30b8\u30e5\u30fc\u30eb\u5185\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u516c\u958b\u3057\u3066\u3044\u304d\u307e\u3059\u3002
      \n\u6700\u5f8c\u306bmain.rs\u5185\u3067\u540c\u968e\u5c64\u306e\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u8aad\u307f\u8fbc\u307f\u307e\u3059\u3002<\/p>\n
      mod<\/span> components<\/span>;<\/span>\r\n<\/code><\/pre>\n
      \u3053\u308c\u3067use\u3092\u7528\u3044\u3066\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u30a4\u30f3\u30dd\u30fc\u30c8\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n
      \/\/\u7d76\u5bfe\u30d1\u30b9<\/span>\r\nuse<\/span> crate<\/span>::<\/span>components<\/span>::<\/span>molecules<\/span>::<\/span>MoleculesSample<\/span>::<\/span>MoleculesSample<\/span>;<\/span>\r\n\/\/\u76f8\u5bfe\u30d1\u30b9<\/span>\r\nuse<\/span> super<\/span>::<\/span>super<\/span>::<\/span>molecules<\/span>::<\/span>MoleculesSample<\/span>::<\/span>MoleculesSample<\/span>;<\/span>\r\n<\/code><\/pre>\n
      TS\/JS\u3068\u306f\u5168\u7136\u52dd\u624b\u304c\u9055\u3063\u3066\u6238\u60d1\u3046\u304b\u3068\u306f\u601d\u3044\u307e\u3059\u304c\u3001Rust\u3067\u306f\u3053\u306e\u3088\u3046\u306b\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u30a4\u30f3\u30dd\u30fc\u30c8\u3057\u307e\u3059\u3002
      \n\u3061\u306a\u307f\u306b\u30cd\u30c3\u30c8\u3067\u8abf\u3079\u308b\u3068\u540c\u968e\u5c64\u306b{\u30e2\u30b8\u30e5\u30fc\u30eb\u540d}.rs\u3067\u306f\u306a\u304fmod.rs\u3092\u7528\u3044\u3066\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u516c\u958b\u3059\u308b\u65b9\u6cd5\u304c\u304b\u306a\u308a\u51fa\u3066\u304d\u307e\u3059\u304c\u3001mod.rs\u3092\u7528\u3044\u308b\u65b9\u6cd5\u306f2015\u30a8\u30c7\u30a3\u30b7\u30e7\u30f3\u306e\u65b9\u6cd5\u3089\u3057\u304f\u30012021\u30a8\u30c7\u30a3\u30b7\u30e7\u30f3\u306e\u73fe\u5728\u306f\u63a8\u5968\u3055\u308c\u3066\u3044\u307e\u305b\u3093\u3002\uff08\u5f8c\u65b9\u4e92\u63db\u6027\u3092\u4fdd\u3064\u305f\u3081\u304b\u4e00\u5fdc\u4eca\u3067\u3082\u3067\u304d\u308b\u3088\u3046\u306b\u306f\u306a\u3063\u3066\u3044\u307e\u3059\u304c\u3001\u540c\u540d\u306emod.rs\u304c\u5927\u91cf\u306b\u30b3\u30fc\u30c9\u4e0a\u306b\u51fa\u3066\u304f\u308b\u3088\u3046\u306b\u306a\u308b\u306e\u3067\u30b3\u30fc\u30c9\u306e\u898f\u6a21\u304c\u5927\u304d\u304f\u306a\u308b\u307b\u3069\u898b\u3065\u3089\u304f\u306a\u308a\u307e\u3059\u3002\uff09\u53c2\u8003\u8cc7\u6599\uff1aRust Edition Guide<\/p>\n
      \uff13\u30fb\u69cb\u9020\u4f53\uff08Struct\uff09\u3001Trait\u3001\u7d99\u627f<\/h3>\n
      \u69cb\u9020\u4f53\u3084\u30c8\u30ec\u30a4\u30c8\u306e\u6982\u5ff5\u3082React\u306b\u306f\u767b\u5834\u3057\u306a\u3044\u306e\u3067\u6700\u521d\u306f\u5c11\u3057\u6238\u60d1\u3046\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002
      \n\u69cb\u9020\u4f53\u3068\u306f\u30c7\u30fc\u30bf\u578b\u306e\u8981\u7d20\u3092\u96c6\u3081\u305f\u3082\u306e\u3067Typescript\u3067\u3044\u3046interface\u3084type\u306b\u8fd1\u3044\u3082\u306e\u3067\u3059\u3002
      \n\u672c\u8a18\u4e8b\u306eProps\u306e\u5b9a\u7fa9\u3001\u6e21\u3057\u65b9\u306e\u30bb\u30af\u30b7\u30e7\u30f3\u306b\u3082\u69cb\u9020\u4f53\u3092\u4f7f\u7528\u3057\u3066Props\u3092\u5b9a\u7fa9\u3057\u3066\u3044\u305f\u7b87\u6240\u304c\u3042\u3063\u305f\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n
      #[derive(Props,<\/span> PartialEq)]<\/span> \/\/\u2190\u3053\u308c\u306f\u4f55\uff1f<\/span>\r\npub<\/span> struct<\/span> Props<\/span> {<\/span>\r\n    text<\/span>:<\/span> String<\/span>,<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
      \u3082\u3046\u4e00\u5ea6\u898b\u305f\u6642\u306b\u3001#[derive()]\u306e\u8a18\u8ff0\u304c\u3042\u308b\u3053\u3068\u306b\u6c17\u304c\u3064\u304d\u307e\u3059\u304c\u3001\u3053\u308c\u306b\u306fRust\u306eTrait\u3068\u7d99\u627f\uff08derive\uff09\u306e\u6a5f\u80fd\u304c\u95a2\u308f\u3063\u3066\u304d\u307e\u3059\u3002
      \nTrait(\u30c8\u30ec\u30a4\u30c8)\u3068\u306f\u3001\u578b\u306b\u5b9a\u7fa9\u3067\u304d\u308b\u5171\u901a\u306e\u632f\u308b\u821e\u3044\u306e\u3053\u3068\u3067\u3059\u3002
      \nTrait\u306f\u81ea\u5206\u3067\u5b9f\u88c5\u3059\u308b\u3053\u3068\u3082\u3067\u304d\u308b\u306e\u3067\u3059\u304c\u3001#[derive()]\u30a2\u30c8\u30ea\u30d3\u30e5\u30fc\u30c8\u3092\u4f7f\u7528\u3057\u3066\u6a19\u6e96\u3067\u7528\u610f\u3055\u308c\u3066\u3044\u308bTrait\u3092\u69cb\u9020\u4f53\u306b\u5b9f\u88c5\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002derive\u3067\u304d\u308b\u6a19\u6e96Trait
      \n\u3053\u308c\u306b\u3088\u308a\u3001\u69cb\u9020\u4f53\u306b\u69d8\u3005\u306a\u6a5f\u80fd\u3092\u4ed8\u4e0e\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n
      \u3053\u306e\u4ed6\u306b\u3082\u3001\u69cb\u9020\u4f53\u306b\u306fimpl\u30ad\u30fc\u30ef\u30fc\u30c9\u3067\u30e1\u30bd\u30c3\u30c9\u3092\u95a2\u9023\u3065\u3051\u308b\u3053\u3068\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\n
      \uff14\u30fbraw identifier<\/h3>\n
      Dioxus\u3067input\u8981\u7d20\u306etype\u3092\u6307\u5b9a\u3057\u3088\u3046\u3068\u3059\u308b\u3068\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u30a8\u30e9\u30fc\u306b\u906d\u9047\u3057\u307e\u3059\u3002<\/p>\n
      \"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8<\/div>\n
      \"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8<\/div>\n
      \u307e\u3068\u3081<\/h2>\n
      \u672c\u8a18\u4e8b\u3067\u306fDioxus\u3068Rust\u306e\u57fa\u672c\u7684\u306a\u4f7f\u3044\u65b9\u306b\u3064\u3044\u3066\u7d39\u4ecb\u3057\u307e\u3057\u305f\u3002Dioxus\u306f\u307e\u3060\u307e\u3060\u767a\u5c55\u9014\u4e0a\u3067\u3059\u304c\u3001\u69d8\u3005\u306a\u30d7\u30e9\u30c3\u30c8\u30d5\u30a9\u30fc\u30e0\u5411\u3051\u306b\u30b3\u30f3\u30d1\u30a4\u30eb\u3067\u304d\u308b\u70b9\u304c\u9b45\u529b\u7684\u3060\u3068\u611f\u3058\u307e\u3057\u305f\u3002Web\u3001Desktop\u3001Mobile\u3001\u5168\u3066\u3092Rust\u3067\u5b9f\u88c5\u30fb\u30fb\u306a\u3093\u3066\u3067\u304d\u305f\u3089\u3044\u3044\u3067\u3059\u306d\u3002
      \n\u79c1\u81ea\u8eabRust\u306e\u7406\u89e3\u304c\u307e\u3060\u307e\u3060\u306a\u306e\u3067\u3001\u4eca\u5f8c\u3082\u7d99\u7d9a\u7684\u306b\u5b66\u7fd2\u3057\u3066\u3053\u306e\u8a18\u4e8b\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u3082\u3063\u3068\u5145\u5b9f\u3055\u305b\u3088\u3046\u3068\u8003\u3048\u3066\u3044\u307e\u3059\uff01
      \n\u6b21\u56de\u306f@nishi_takuya\u3055\u3093\u306e\u30c6\u30b9\u30c8\u30b1\u30fc\u30b9\u3092\u4f5c\u308b\u3068\u304d\u306b\u6c17\u3092\u4ed8\u3051\u3066\u3044\u308b\u3053\u3068\u3067\u3059\uff01<\/p>\n
      \u53c2\u8003\u8cc7\u6599<\/h2>\n
      Rust Document
      \nDioxus Document
      \nThe Rust Edition Guide
      \nThe rustc book
      \nRust\u5165\u9580<\/p>\n","protected":false},"excerpt":{"rendered":"
      \u306f\u3058\u3081\u306b \u3053\u308c\u306f \u682a\u5f0f\u4f1a\u793e RetailAI X Advent Calendar 2022 \u306e 9 \u65e5\u76ee\u306e\u8a18\u4e8b […]<\/p>\n","protected":false},"author":11,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-45198","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"\n- Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:description\" content=\"\u306f\u3058\u3081\u306b \u3053\u308c\u306f \u682a\u5f0f\u4f1a\u793e RetailAI X Advent Calendar 2022 \u306e 9 \u65e5\u76ee\u306e\u8a18\u4e8b […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2023-06-15T14:37:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-30T13:41:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d5d5437434c4406cf12da\/43-0.png\" \/>\n<meta name=\"author\" content=\"\u65b0, \u97f5\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u65b0, \u97f5\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/\",\"name\":\"- Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2023-06-15T14:37:23+00:00\",\"dateModified\":\"2024-04-30T13:41:29+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9\",\"name\":\"\u65b0, \u97f5\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g\",\"caption\":\"\u65b0, \u97f5\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/yunxin\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"- Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/","og_locale":"zh_CN","og_type":"article","og_description":"\u306f\u3058\u3081\u306b \u3053\u308c\u306f \u682a\u5f0f\u4f1a\u793e RetailAI X Advent Calendar 2022 \u306e 9 \u65e5\u76ee\u306e\u8a18\u4e8b […]","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2023-06-15T14:37:23+00:00","article_modified_time":"2024-04-30T13:41:29+00:00","og_image":[{"url":"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d5d5437434c4406cf12da\/43-0.png"}],"author":"\u65b0, \u97f5","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u65b0, \u97f5","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"4 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/","name":"- Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2023-06-15T14:37:23+00:00","dateModified":"2024-04-30T13:41:29+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/"]}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9","name":"\u65b0, \u97f5","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g","caption":"\u65b0, \u97f5"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/yunxin\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/45198-2\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45198","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=45198"}],"version-history":[{"count":2,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45198\/revisions"}],"predecessor-version":[{"id":94462,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45198\/revisions\/94462"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=45198"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=45198"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=45198"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}