在 React Native 中安装并初始化 Reown WalletKit
📅
Reown 是一家以用户体验为核心的公司，提供 AppKit 和 WalletKit 工具包，帮助所有构建链上应用的人改善用户体验。（来源：Reown 官网↗）
npm install @reown/walletkit @walletconnect/react-native-compat
npm install @react-native-async-storage/async-storage @react-native-community/netinfo react-native-get-random-values fast-text-encoding
npm install @walletconnect/jsonrpc-types --devyarn add @reown/walletkit @walletconnect/react-native-compat
yarn add @react-native-async-storage/async-storage @react-native-community/netinfo react-native-get-random-values fast-text-encoding
yarn add @walletconnect/jsonrpc-types --devnpx expo install expo-application
import '@walletconnect/react-native-compat'
// Other imports...WalletKit.init 初始化 WalletKit。将 Reown 提供的 Core 对象传给 core 属性，并在 metadata 属性中设置钱包名称、描述、图标及重定向 URL 等。WalletKit.init 方法返回 Promise，初始化完成后即可使用返回的 WalletKit 对象。这里通过 useState 将 WalletKit 对象作为状态管理。
Core 的 projectId 请使用创建 Reown 项目时获得的项目 ID。import '@walletconnect/react-native-compat';
import { WalletKit } from '@reown/walletkit';
import { WalletKit as WalletKitType } from '@reown/walletkit/dist/types/client';
import { Core } from '@walletconnect/core';
import { useEffect, useState } from 'react';
import { Text } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
const core = new Core({
projectId: 'your_project_id', // reown 프로젝트 ID
});
const App = () => {
const [walletKit, setWalletKit] = useState<WalletKitType>();
useEffect(() => {
WalletKit.init({
core,
metadata: { // 지갑 메타데이터 (본인 상황에 맞게 수정)
name: 'Demo React Native Wallet Promlee',
description: 'Demo RN Wallet to interface with Dapps',
url: 'www.promleeblog.com',
icons: ['https://your_wallet_icon.png'],
redirect: {
native: 'promleewallet://',
},
},
}).then((kit) => {
setWalletKit(kit);
});
}, []);
return (
<SafeAreaView style={{ padding: 20 }}>
<Text>{walletKit?.metadata.name}</Text>
</SafeAreaView>
);
};
export default App;