Solution · code-edit

emits 與 payload 契約

對照完整答案、責任邊界與原因。

Solution 要做什麼

對照完整答案、責任邊界與原因。

本主題檔案：files/main.js

定位：先固定事件名稱與 payload shape，再檢查 handler。

頁面不會替你修改檔案；請在實作檔完成後重新整理確認。

父層 selectedId 空白、eventCount=0。

declared=true、eventCount=1、payloadId=service-42。

emits:['select']; emit('select', service.id)；父層 @select='handleSelect'。

只在本階段資料夾內操作，避免改到其他章節。

index.html
Vue DOM template：提供唯一 #app、service-list、兩階段綁定與 aria-live status。
style.css
呈現層：控制卡片、button、focus、status 與 360px 窄版可讀性。
main.js
Vue 行為：在 createApp 外宣告 ServiceCard，註冊後由 props、emits 與 parent handler 串起資料流。

證據：declared=true、eventCount=1、payloadId=service-42