feat: popup close button accessible with tab key

This commit is contained in:
chikara-chan
2017-05-10 17:02:59 +08:00
committed by 杨奕
parent 6563a3a804
commit d41c0c4ba9
4 changed files with 46 additions and 29 deletions

View File

@@ -1,10 +1,13 @@
<template>
<transition name="msgbox-fade">
<div class="el-message-box__wrapper" v-show="visible" @click.self="handleWrapperClick">
<div class="el-message-box__wrapper" tabindex="-1" v-show="visible" @click.self="handleWrapperClick">
<div class="el-message-box" :class="customClass">
<div class="el-message-box__header" v-if="title !== undefined">
<div class="el-message-box__title">{{ title || t('el.messagebox.title') }}</div>
<i class="el-message-box__close el-icon-close" @click="handleAction('cancel')" v-if="showClose"></i>
<button type="button" class="el-message-box__headerbtn" aria-label="Close"
v-if="showClose" @click="handleAction('cancel')">
<i class="el-message-box__close el-icon-close"></i>
</button>
</div>
<div class="el-message-box__content" v-if="message !== ''">
<div class="el-message-box__status" :class="[ typeClass ]"></div>