$emit() コンポーネントイベントの発火
最終更新:2026-10-22
$emit() コンポーネントイベントの発火
$emit はカスタムイベントを発火させ、引数は親のリスナーへ届きます。子から親への標準的なチャネルです。
| グループ | オプション: 合成とその他 |
|---|---|
| 種類 | オプション |
| スコープ | コンポーネント内 |
| Vue バージョン | 3.0+ |
| SSR 対応 | 対応 |
📝 構文
export default {
methods: {
save() { this.$emit("save", { id: 1 }) }
}
}
⚙️ 引数
| value | イベント名と任意のペイロード引数 |
|---|
戻り値:戻り値なし
▶ 例
以下のコードを編集して結果を確認しましょう:
出力:
Clicking shows the payload id.
💡 ポイント
ℹ️ 補足 emits に名前を宣言すると警告を避けられ、ツールのサポートも得られます。
💡 ヒント DOM テンプレートでは kebab-case の名前を推奨します。
⚠️ 注意 イベント名は大文字小文字を区別し、DOM テンプレートでは小文字化されます。
🏷️ 関連合成とその他
💡 関連ケース
関連ケースは近日公開予定。
📚 関連チュートリアル
❓ よくある質問
Q 子のメソッドを呼ぶのと比べてどうですか?
A emit は単方向フローを保ちます。ref 呼び出しはコンポーネントを密結合させます。
Q 複数の引数を渡せますか?
A 渡せます。ハンドラーが順番に受け取ります。
Q 誰もリッスンしないとどうなりますか?
A 何も起きません。イベントは任意です。