fangliaoxiaochengxv/subPages/setting/index.vue

<template>
  <view class="shopping-wrapper">
    <view class="common-card" v-for="(item, index) in list" :key="index" @click="toSubPages(item.index)">
      <view class="display-flex-between">
        <view class="mt15 mb15 display-flex-content-center">
          <image :src="item.url" class="mr12" mode="heightFix" style="width: 36rpx;height: 36rpx"></image>
          <text class="member-other-card-name">{{ item.name }}</text>
        </view>
        <view>
          <u-icon name="arrow-right" bold color="#333333" size="14"></u-icon>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
import tabbarCom from "@/components/tabbar/tabbar.vue";
export default {
  components: {tabbarCom},
  data() {
    return {
      list: [
        {
          url: "/static/setting-a.png",
          index: "/subPages/personalDataManagement/index",
          name: "个人资料"
        },
        {
          url: "/static/setting-b.png",
          index: "/subPages/setting/setPwd?type=add",
          name: "安全密码"
        },
        {
          url: "/static/setting-c.png",
          index: "/subPages/setting/setPwd?type=set-2",
          name: "忘记安全密码"
        }
      ],
    };
  },
  methods: {
    toSubPages(index) {
      uni.navigateTo({
        url: index,
      });
    },
  }

}
</script>

<style lang="scss" scoped>
.shopping-wrapper {
  padding: 30rpx 30rpx 178rpx;

  .common-card {
    background: #FFFFFF;
    border-radius: 16rpx 16rpx 16rpx 16rpx;
    padding: 0 20rpx;

    member-other-card -name {
      font-family: PingFang SC, PingFang SC;
      font-weight: 400;
      font-size: 28rpx;
      color: #333333;
      line-height: 48rpx;
      text-align: left;
      font-style: normal;
      text-transform: none;
    }
  }
}
</style>