cv-cell-row 单行单元格 ¶

<template>
  <view class="content">
    <view class="components-title">
      <view class="components-title-t">cv-cell-row</view>
      <view class="components-title-d">列表</view>
    </view>
    <cv-cell-row leftTop="左边上" rightIcon />
    <cv-cell-row leftTop="左边上" leftBottom="左边下" rightIcon />
    <cv-cell-row leftTop="左边上" leftBottom="左边下" rightTop="右边上" rightIcon />
    <cv-cell-row leftTop="左边上" leftBottom="左边下" rightTop="右边上" rightBottom="右边下" rightIcon />
    <cv-cell-row leftTop="左边上" rightTop="右边上" />

    <view>带图标的列表</view>
    <cv-cell-row leftIcon="/static/logo.png" leftTop="左边上" rightTop="提示内容" rightIcon />
    <cv-cell-row leftIcon="/static/logo.png" leftTop="左边上" rightTop="右边第一行" rightIcon />

    <view>带跳转链接的列表</view>
    <cv-cell-row
      leftIcon="/static/logo.png"
      leftTop="绑定@click自定义方法"
      rightTop="提示内容"
      @click="handleJumps('/pages/layout/cv-cell-row?b=1')"
    />
    <view>用插槽模式</view>
    <cv-cell-row @click="handleJumps('/pages/layout/cv-cell-row?a=1')" rightIcon>
      <template #leftImage><cv-icons type="action-pingjia-filled" color="#04d7ec" /></template>
      <template #leftTop>左边上面内容</template>
      <template #leftBottom>左边下面内容</template>
      <template #rightTop>右边上面内容</template>
      <template #rightBottom>右边下面内容</template>
    </cv-cell-row>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  onLoad() {},
  methods: {
    handleJumps(url) {
      uni.navigateTo({
        url: url
      });
    },
    onClick(url) {
      uni.showToast({
        title: url,
        duration: 2000,
        icon: 'none'
      });
    }
  }
};
</script>

<style>
.content {
  overflow: auto;
  min-height: 600px;
  background-color: #eee;
  position: relative;
}
.default-slot {
  min-height: 100px;
  background-color: #ffffff;
  text-align: center;
  margin: 5px 15px;
}
</style>