import { defineComponent } from 'vue' ; import { getPrefixCls } from '../_utils/global-config' ; export default defineComponent ( { name : 'ListItem' , props : { zh en actionLayout : { type : String , default : 'horizontal' } } , zh en slot zh en slot zh en slot setup ( props , { slots } ) { const prefixCls = getPrefixCls ( 'list-item' ) ; const renderAction = ( ) => { const actions = slots . actions ?. ( ) ; if ( ! actions || ! actions . length ) { return null ; } return ( < ul class = { `${ prefixCls }-action` } > { actions . map ( ( item , index ) => ( < li key = { `${ prefixCls }-action-${ index }` } > { item } < /li>))} < /ul>); } ; return ( ) => ( < li class = { prefixCls } > < div class = { `${ prefixCls }-main` } > { slots . meta ?. ( ) } < div class = { `${ prefixCls }-content` } > { slots . default ?. ( ) } < /div> { props . actionLayout === 'vertical' && renderAction ( ) } < /div> { props . actionLayout === 'horizontal' && renderAction ( ) } { slots . extra && < div class = { `${ prefixCls }-extra` } > { slots . extra ( ) } < /div>} < /li>); } } ) ;