diff --git a/src/components/list/__snapshots__/index.test.js.snap b/src/components/list/__snapshots__/index.test.js.snap index f89f0158e..9787f5f9a 100644 --- a/src/components/list/__snapshots__/index.test.js.snap +++ b/src/components/list/__snapshots__/index.test.js.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`List Snap render completed List -- no border 1`] = `"
undefined
undefinedundefinedundefinedundefined
undefined
undefinedundefinedundefinedundefined
"`; +exports[`List Snap render completed List -- no border 1`] = `"
undefined
undefinedundefinedundefinedundefined
undefined
undefinedundefinedundefinedundefined
"`; -exports[`List Snap render completed List 1`] = `"
undefined
undefinedundefinedundefinedundefined
undefined
undefinedundefinedundefined
undefined
undefinedundefinedundefinedundefined
undefined
详细信息
undefinedundefinedundefined
undefined
undefinedundefinedundefined
undefined
详细信息
undefinedundefined
undefined
详细信息详细信息详细信息详细信息
undefinedundefined
详细信息
undefinedundefined
undefined
undefinedundefined
undefined
undefined
undefinedundefined
undefined
"`; +exports[`List Snap render completed List 1`] = `"
undefined
undefinedundefinedundefinedundefined
undefined
undefinedundefinedundefined
undefined
undefinedundefinedundefinedundefined
undefined
详细信息
undefinedundefinedundefined
undefined
undefinedundefinedundefined
undefined
详细信息
undefinedundefined
undefined
详细信息详细信息详细信息详细信息
undefinedundefined
详细信息
undefinedundefined
undefined
undefinedundefined
undefined
undefined
undefinedundefined
undefined
undefined
undefinedundefined
undefined
undefined
undefinedundefined
undefined
"`; diff --git a/src/components/list/index.test.js b/src/components/list/index.test.js index 88c0a4090..99ecb669f 100644 --- a/src/components/list/index.test.js +++ b/src/components/list/index.test.js @@ -29,7 +29,9 @@ describe('List Snap', () => { thumb='http://img12.360buyimg.com/jdphoto/s72x72_jfs/t10660/330/203667368/1672/801735d7/59c85643N31e68303.png' /> + + ) expect(component).toMatchSnapshot() diff --git a/src/components/list/item/index.js b/src/components/list/item/index.js index c76676eb2..62c4ca05d 100644 --- a/src/components/list/item/index.js +++ b/src/components/list/item/index.js @@ -38,7 +38,7 @@ export default class AtListItem extends AtComponent { extraText, hasBorder, extraThumb, - switchIsCheck, + switchIsCheck } = this.props const rootClass = classNames( @@ -54,51 +54,58 @@ export default class AtListItem extends AtComponent { return ( - {thumb && ( - - - - )} - - - {title} - {note && {note}} - - - - {extraText && {extraText}} - - {extraThumb && - !extraText && ( - + + {thumb && ( + )} - - {isSwitch && - !extraThumb && - !extraText && ( - - + + + {title} + {note && {note}} - )} + + + {extraText && {extraText}} - {arrow && ( - - - - )} + {extraThumb && + !extraText && ( + + + + )} + + {isSwitch && + !extraThumb && + !extraText && ( + + + + )} + + {arrow && ( + + + + )} + ) @@ -108,7 +115,7 @@ export default class AtListItem extends AtComponent { AtListItem.defaultProps = { hasBorder: true, isSwitch: false, - disabled: false, + disabled: false } AtListItem.propTypes = { diff --git a/src/components/list/item/index.scss b/src/components/list/item/index.scss index a4ac601e5..e9901277e 100644 --- a/src/components/list/item/index.scss +++ b/src/components/list/item/index.scss @@ -8,15 +8,13 @@ $item-horizontal-padding: 24px; width: $size; height: $size; - &-info { + &__info { width: 100%; height: 100%; } } .at-list__item { - @include display-flex; - @include align-items(center); @include active; padding: $spacing-v-lg $spacing-h-lg; @@ -38,6 +36,11 @@ $item-horizontal-padding: 24px; left: $spacing-h-lg; } + &-container { + @include display-flex; + @include align-items(center); + } + &--thumb { .item-thumb { margin-right: $item-horizontal-padding; @@ -46,7 +49,9 @@ $item-horizontal-padding: 24px; } &--disabled { - opacity: $opacity-disabled; + .at-list__item-container { + opacity: $opacity-disabled; + } &:active { background-color: transparent !important; diff --git a/src/pages/layout/list/index.js b/src/pages/layout/list/index.js index 50f90cf26..bd45dbaf1 100644 --- a/src/pages/layout/list/index.js +++ b/src/pages/layout/list/index.js @@ -123,6 +123,13 @@ export default class ListPage extends Component { onClick={this.handleClick} onSwitchChange={this.handleChange} /> +