created インスタンス作成完了
最終更新：2026-10-22
created インスタンス作成完了
created はインスタンスの初期化が完了し、data と methods が使えるようになった後に呼ばれます。まだ DOM は存在せず、データの初期化やリクエスト送信に適した場所です。
| グループ | オプション: 描画とライフサイクル |
|---|---|
| 種類 | オプション |
| スコープ | コンポーネント内 |
| Vue バージョン | 3.0+ |
| SSR 対応 | 対応 |
📝 構文
export default {
created() {
this.load() // data ready; DOM absent
}
}⚙️ 引数
| value | 引数なし |
|---|
戻り値：戻り値なし
▶ 例
以下のコードを編集して結果を確認しましょう：
出力：
Shows 'initialised in created'.💡 ポイント
💡 ヒント DOM が必要な作業は mounted に置きます。純粋なデータ準備（リクエスト含む）はこちらの方が早く実行されます。
⚠️ 注意 SSR では created がサーバー側で実行されるため、window や document へのアクセスを避けてください。
ℹ️ 補足 Composition API では、同等の位置が setup 関数の本体です。
🏷️ 関連描画とライフサイクル
💡 関連ケース
関連ケースは近日公開予定。
📚 関連チュートリアル
❓ よくある質問
Q created と mounted はどう使い分けますか？
A DOM が不要なら → created。DOM 操作なら → mounted。
Q ここでリクエストを送れますか？
A 送れます。Options API で一般的な方法です。SSR のタイミングに注意してください。
Q Composition API ではどれに相当しますか？
A setup 関数の本体で、両方のフックを置き換えます。
