在包中找不到 React js 函数

React js function not found in package

当使用来自 import { ElvWalletClient } from "@eluvio/elv-wallet-client";

ElvWalletClient.Item({"x":"1","y":"2"})

我收到以下错误

eluvio_elv_wallet_client__WEBPACK_IMPORTED_MODULE_1_.ElvWalletClient.Item is not a function

在查看 source code 时,我确实看到了方法(第 338 行)

exports.Item = async function ({contractAddress, tokenId}) {
  Assert("Item", "Contract address", contractAddress);
  Assert("Item", "Token ID", tokenId);

  return await this.SendMessage({
    action: "item",
    params: {
      contractAddress,
      tokenId: tokenId.toString()
    }
  });
};

代码

import React, { useEffect, useState } from 'react'
import { ElvWalletClient } from "@eluvio/elv-wallet-client";

const Methods = ({client, userProfile}) => {
    const [itemData, setItemData] = useState(undefined);
    const popupClient = ElvWalletClient.Item({contractAddress: "0x48341be85e735322862d654a3f3c69854a16ccaf",itemId: "407"})
    .then(data => {
        itemData(data)

      })
      .catch(error => console.error(error));

    return (
        <div>
            <div>{itemData}</div>
        </div>
    )
}

export default Methods

初始化钱包

ElvWalletClient.InitializeFrame({
      walletAppUrl: "https://wallet.contentfabric.io",
      target: element,
      requestor: "WWE Moonsault",
      loginOnly: true,
      darkMode: true,
      // NOTE: This should be changed to tenant slug + marketplace slug when the marketplace is published
      marketplaceId: "iq__2zMYXQ6SwRFhjAc73ppcn4RP5KX3"
    })
      .then(client => {
        SetClient(client)

        // If previously used client is present, ensure it is destroyed
        if(previousClient) {
          previousClient.Destroy();
        }
      })
      .catch(error => console.error(error));

Package.json

{
  "name": "elv-wallet-client-demo",
  "version": "0.1.0",
  "private": true,
  "homepage": "./",
  "dependencies": {
    "@eluvio/elv-wallet-client": "^1.0.1",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.1.1",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^0.27.2",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "reactSnap": {
    "inlineCss": true
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

在尝试调用该函数之前,您是否初始化了钱包?从您包含的代码来看,似乎并非如此。

根据此包的 source 代码,您不应使用默认构造函数,而应使用以下之一:

  1. InitializeFrame: 在新的 iframe 中初始化媒体钱包
  2. InitializePopup: 在新的 window
  3. 中初始化媒体钱包

尝试以下方法之一:

import { ElvWalletClient } from "@eluvio/elv-wallet-client";

// Initialize in iframe at target element
const walletClient = await ElvWalletClient.InitializeFrame({
  requestor: "My App",
  walletAppUrl: "https://wallet.contentfabric.io",
  target: document.getElementById("#wallet-target")
});
    
// Or initialize in a popup
const walletClient = await ElvWalletClient.InitializePopup({
  requestor: "My App",
  walletAppUrl: "https://wallet.contentfabric.io",
});

如果您已经初始化了钱包并且它是您作为道具传递给 Method 的值,请尝试在 client 上调用 Item():

const Methods = ({client, userProfile}) => {
    const [itemData, setItemData] = useState(undefined)

    // Change this to const popupClient = client.Item({...})
    const popupClient = ElvWalletClient.Item({contractAddress: "0x48341be85e735322862d654a3f3c69854a16ccaf",itemId: "407"})
    
    ...
}

作为旁注,由于 InitializeFrameInitializePopup 方法是 async,在尝试调用其他方法之前检查 promise 是否已解决可能是有益的client.

上的方法