列表组件

介绍

列表组件应用范围比较广，主要用在列表展示和表单填写

这里主要使用color-ui的列表组件，代码pages/user/user.vue

顶部导航"我的"示例代码一

<view class="cu-list menu">
  <view class="cu-item" :class="baseInfoIcon[index].arrow?'arrow':''" v-for="(value, key, index) in baseInfo" :key="index"
    :index="index">
    <view class="content">
      <text class="list-left-icon cu-avatar round iconfont" :class="['bg-' + baseInfoIcon[index].color, baseInfoIcon[index].icon]" />
      <u-link v-if="baseInfoIcon[index].arrow" :font-size="30" color="#8799a3" class="link user-item padding-left-sm"
        :href="value">{{ value }}</u-link>
      <text v-else class="user-item padding-left-sm">{{value}}</text>
    </view>
  </view>
</view>

用户基本信息示例代码二

<view class="cu-list menu sm-border">
  <view class="cu-item arrow" v-for="(value, key, index) in baseInfo" :key="index" :index="index">
    <view class="content">
      <text selectable class="text-grey flex-sub text-form-label">{{key}}</text>
      <text selectable class="user-item padding-left-sm flex-treble text-form-value">{{value}}</text>
    </view>
  </view>
</view>