list-view

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

组件结构

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

组件脚本

  1. <script>
  2.     export default {
  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",默认值:""
  5.  methods:
  6.    无

示例

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

← keyboard loading →