wallet/src/pages/trade/index.vue

<template>
    <view class="content">
      <Header>
        <template #title>ACC <span style="padding:0 12rpx;">|</span>连接钱包</template>
      </Header>
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
      <image class="logo" src="/static/logo.png" />
  
      <view class="text-area">
        <text class="title">{{ title }}</text>
      </view>
    </view>
  </template>
  
  <script setup>
  import { ref, onMounted } from "vue";
  import Header from '@/components/Header'
  const title = ref("Hello");
  import getWeb3 from "@/utils/web";
  onMounted(async () => {
    try {
      const web3 = await getWeb3();
      const accounts = await web3.eth.getAccounts();
      console.log("钱包地址：", accounts[0]);
    } catch (err) {
      console.error(err);
    }
  });
  </script>
  
  <style lang="scss" scoped>
  .content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100vw;
  }
  
  .logo {
    height: 200rpx;
    width: 200rpx;
    margin-top: 200rpx;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 50rpx;
  }
  
  .text-area {
    display: flex;
    justify-content: center;
  }
  
  .title {
    font-size: 36rpx;
    color: #8f8f94;
  }
  </style>