list-view

list-view 列表,结合list-cell使用

组件结构

  1. <template>
  2. <viewclass="tui-list-view tui-view-class">
  3. <viewclass="tui-list-title"v-if="title">{{title}}</view>
  4. <viewclass="tui-list-content" :class="[unlined?'tui-border-'+unlined:'']">
  5. <slot></slot>
  6. </view>
  7. </view>
  8. </template>

组件脚本

  1. <script>
  2. exportdefault{
  3. name:"tuiListView",
  4. props:{
  5. title:{
  6. type:String,
  7. default:''
  8. },
  9. unlined:{
  10. type:String,
  11. default:''//top,bottom,all
  12. }
  13. }
  14. }
  15. </script>

组件样式

  1. ...此处省略n

脚本说明

  1. props:
  2. "title":列表title,类型:"String",默认值:""
  3. "unlined":去掉线条,可传入[top,bottom,all],类型:"String",默认值:""
  4. methods:

示例

  1. ...此处省略n行,下载源码查看