第4章: TypeScript + React

4-2. Stateの型定義

TypeScriptでStateに型をつける方法を学びます

📚 このレッスンの理論を学びたい方はこちら：


# 課題
User型のオブジェクトをStateで管理するフォームを作成してください。

User型: { name: string; age: number; email: string }

import { useState } from 'react';

// ここにUser型を定義してください

export default function App() {
  // ここにuseStateでUser型のステートを定義してください
  
  return (
    <div>
      <input 
        type="text" 
        placeholder="名前"
        // ここにonChangeを実装
      />
      <input 
        type="number" 
        placeholder="年齢"
        // ここにonChangeを実装
      />
      <input 
        type="email" 
        placeholder="メール"
        // ここにonChangeを実装
      />
      {/* ここに入力された情報を表示 */}
    </div>
  );
}

Open Sandbox

← 前のレッスン: 4-1. Propsの型定義

次のレッスン: 4-3. イベントハンドラの型定義 →