diff --git a/docs/react-router-v7/api/components/Await.md b/docs/react-router-v7/api/components/Await.md
index 0b8e36e..ab41583 100644
--- a/docs/react-router-v7/api/components/Await.md
+++ b/docs/react-router-v7/api/components/Await.md
@@ -4,18 +4,6 @@ title: Await
# Await
-
-
[MODES: framework, data]
## 概要
@@ -30,12 +18,10 @@ https://github.com/remix-run/react-router/blob/main/packages/react-router/lib/co
import { Await, useLoaderData } from "react-router";
export async function loader() {
- // await されない
+ // not awaited
const reviews = getReviews();
- // await される (トランジションをブロックする)
- const book = await fetch("/api/book").then((res) =>
- res.json()
- );
+ // awaited (blocks the transition)
+ const book = await fetch("/api/book").then((res) => res.json());
return { book, reviews };
}
@@ -49,7 +35,7 @@ function Book() {
レビューをロードできませんでした 😬
+ Could not load reviews 😬
}
children={(resolvedReviews) => (
@@ -83,12 +69,12 @@ function Await({
```
-React 要素を使用する場合、[useAsyncValue](../hooks/useAsyncValue) が解決された値を提供します。
+React 要素を使用する場合、[`useAsyncValue`](../hooks/useAsyncValue) が解決された値を提供します。
```tsx [2]
-;
+
function Reviews() {
const resolvedReviews = useAsyncValue();
@@ -98,18 +84,18 @@ function Reviews() {
### errorElement
-[`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) がリジェクトされた場合、children の代わりにエラー要素がレンダリングされます。
+[`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) がリジェクトされた場合、`children` の代わりにエラー要素がレンダリングされます。
```tsx
おっと}
+ errorElement={Oops
}
resolve={reviewsPromise}
>
```
-よりコンテキストに沿ったエラーを提供するには、子コンポーネントで [useAsyncError](../hooks/useAsyncError) を使用できます。
+よりコンテキストに沿ったエラーを提供するには、子コンポーネントで [`useAsyncError`](../hooks/useAsyncError) を使用できます。
```tsx
-;
+
function ReviewsError() {
const error = useAsyncError();
- return レビューのロード中にエラーが発生しました: {error.message}
;
+ return Error loading reviews: {error.message}
;
}
```
-errorElement を提供しない場合、リジェクトされた値は最も近いルートレベルの [`ErrorBoundary`](../../start/framework/route-module#errorboundary) までバブルアップし、[useRouteError](../hooks/useRouteError) フックを介してアクセスできます。
+errorElement を提供しない場合、リジェクトされた値は最も近いルートレベルの [`ErrorBoundary`](../../start/framework/route-module#errorboundary) までバブルアップし、[`useRouteError`](../hooks/useRouteError) hook を介してアクセスできます。
### resolve
-解決してレンダリングするために、[`loader`](../../start/framework/route-module#loader) から返された [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) を受け取ります。
+[`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) を受け取ります。これは、解決およびレンダリングされる [`loader`](../../start/framework/route-module#loader) から返されたものです。
```tsx
import { Await, useLoaderData } from "react-router";
export async function loader() {
- let reviews = getReviews(); // await されない
+ let reviews = getReviews(); // not awaited
let book = await getBook();
return {
book,
- reviews, // これは Promise です
+ reviews, // this is a promise
};
}
export default function Book() {
const {
book,
- reviews, // これは同じ Promise です
+ reviews, // this is the same promise
} = useLoaderData();
return (
@@ -155,7 +141,7 @@ export default function Book() {
{book.description}
}>
diff --git a/docs/react-router-v7/api/components/Form.md b/docs/react-router-v7/api/components/Form.md
index bc68438..507a677 100644
--- a/docs/react-router-v7/api/components/Form.md
+++ b/docs/react-router-v7/api/components/Form.md
@@ -4,27 +4,17 @@ title: Form
# Form
-
-
[MODES: framework, data]
## 概要
[リファレンスドキュメント ↗](https://api.reactrouter.com/v7/functions/react_router.Form.html)
-[`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/fetch) を介してアクションにデータを送信する、プログレッシブエンハンスメントされた HTML [`