feat(GridItem): improve accessbility (#4517)

This commit is contained in:
neverland 2019-09-20 20:23:52 +08:00 committed by GitHub
parent 92f5ac9143
commit 8cd2efe354
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 2 deletions

View File

@ -85,6 +85,8 @@ export default createComponent({
<div class={[bem({ square })]} style={this.style} onClick={this.onClick}> <div class={[bem({ square })]} style={this.style} onClick={this.onClick}>
<div <div
style={this.contentStyle} style={this.contentStyle}
role={clickable ? 'button' : null}
tabindex={clickable ? 0 : null}
class={[ class={[
bem('content', { bem('content', {
center, center,

View File

@ -153,11 +153,11 @@ exports[`renders demo correctly 1`] = `
<div> <div>
<div class="van-grid van-hairline--top"> <div class="van-grid van-hairline--top">
<div class="van-grid-item" style="flex-basis: 50%;"> <div class="van-grid-item" style="flex-basis: 50%;">
<div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--clickable van-hairline"><i class="van-icon van-icon-home-o van-grid-item__icon"> <div role="button" tabindex="0" class="van-grid-item__content van-grid-item__content--center van-grid-item__content--clickable van-hairline"><i class="van-icon van-icon-home-o van-grid-item__icon">
<!----></i><span class="van-grid-item__text">路由跳转</span></div> <!----></i><span class="van-grid-item__text">路由跳转</span></div>
</div> </div>
<div class="van-grid-item" style="flex-basis: 50%;"> <div class="van-grid-item" style="flex-basis: 50%;">
<div class="van-grid-item__content van-grid-item__content--center van-grid-item__content--clickable van-hairline"><i class="van-icon van-icon-search van-grid-item__icon"> <div role="button" tabindex="0" class="van-grid-item__content van-grid-item__content--center van-grid-item__content--clickable van-hairline"><i class="van-icon van-icon-search van-grid-item__icon">
<!----></i><span class="van-grid-item__text">URL 跳转</span></div> <!----></i><span class="van-grid-item__text">URL 跳转</span></div>
</div> </div>
</div> </div>