Name:
interface
Value:
Amplify has re-imagined the way frontend developers build fullstack applications. Develop and deploy without the hassle.

Page updated Apr 30, 2024

Maintenance ModeYou are viewing Amplify Gen 1 documentation. Amplify Gen 1 has entered maintenance mode and will reach end of life on May 1, 2027. New project should use Amplify Gen 2. For existing Gen 1 projects, a migration guide and tooling are available to help you upgrade. Switch to the latest Gen 2 docs →

コード内で入力要素を拡張する

Amplify Studio フォームはすべて Amplify UI ライブラリ に基づいています。生成されたフォームは、各入力コンポーネントのプロパティをオーバーライドするメカニズムを提供します。

特定の入力プロパティを動的に変更する

overrides プロパティを使用して、オーバーライドする入力コンポーネントを選択し、変更したいプロップを渡します。たとえば、特定のフォーム要素の説明テキストを動的に切り替えたいとします:

function ProductFormContainer({ productType }) {
return (
<div className="App">
<ProductForm
overrides={{
name: {
descriptiveText: `Enter ${productType} name`
}
}}
/>
</div>
);
}

注: 生成されたフォームによってすでに設定されているプロパティをオーバーライドすることはお勧めしません。これにより、実行時に予期しない動作が発生する可能性があります。設定されたプロパティは、src/ui-components/<your-form-component>.jsx ファイルのコンポーネントに移動して確認してください。