iView‐List - daniel-qa/Vue GitHub Wiki

#

<List bordered>
  <ListItem
    v-for="item in list"
    :key="item"
    @click="handleClick(item)"
    class="item"
  >
    {{ item }}
  </ListItem>
</List>

export default {
  data() {
    return {
      list: [
        '玉山學校',
        '醒吾學校',
        '市立敦化國中',
        '智連環學校',
        '龍騰文化'
      ]
    }
  },
  methods: {
    handleClick(item) {
      console.log('選到:', item)
    }
  }
}
.item {
  cursor: pointer;
}
.item:hover {
  background: #f5f7fa;
}

List 本身「不負責 click」

👉 它只是容器

👉 click 一定要自己加

2️⃣ clickable 的關鍵其實是這行

@click="handleClick(item)"

3️⃣ hover 效果要自己補

官方不會幫你做 selectable list（它偏展示用）

⚠️ **GitHub.com Fallback** ⚠️