<template>
  <div>
    <button @click="connectWallet">连接钱包</button>
    <button @click="signMessage">签名</button>
  </div>
</template>

<script>
import Web3 from 'web3';

export default {
    
    
  data() {
    
    
    return {
    
    
      web3: null,
      connected: false,
      message: 'This is a test message',
      signature: '',
    };
  },
  methods: {
    
    
    async connectWallet() {
    
    
  if (!window.ethereum) {
    
    
    console.warn("请安装MetaMask");
    return;
  }

  try {
    
    
    await window.ethereum.request({
    
     method: 'eth_requestAccounts' });
    this.web3 = await new Web3(window.ethereum);
    this.connected = true;
    console.log("已连接钱包");
  } catch (error) {
    
    
    console.error(error);
  }
},
// async connectWallet() {
    
    
//       if (window.ethereum) {
    
    
//         // 如果用户已经安装了狐狸钱包
//         await window.ethereum.request({ method: 'wallet_requestPermissions', params: [{ eth_accounts: {} }] })
//         // 并请求连接到用户当前选定的账户
//         await window.ethereum.enable()
//         // 取得连接到的用户地址
//         const address = await window.ethereum.selectedAddress
//         console.log(`已连接到地址 ${address}`)
//         this.connected = true;
//       } else {
    
    
//         alert('请您先安装狐狸钱包')
//       }
//     },

    async signMessage() {
    
    
      if (!this.connected) {
    
    
        console.warn("请先连接到钱包");
        return;
      }

      const address = (await this.web3.eth.getAccounts())[0];
      console.log(address);

      const signature = await this.web3.eth.personal.sign(this.message, address);
      this.signature = signature;
      console.log(signature);
    },
  },
};
</script>