So erstellst du eine grundlegende STON.fi-Swap-Ansicht in React Eine STON.fi-Swap-Ansicht in React sollte eine saubere, zuverlässige Abfolge vor visueller Komplexität priorisieren. Die Kernaufgabe besteht darin, eine TON-Wallet zu verbinden, die richtigen Assets zu laden, die angezeigten Beträge in On-Chain-Einheiten umzuwandeln, den Swap zu simulieren, die Transaktion mit dem SDK zu erstellen und sie über TON Connect zu senden – ohne private Keys offenzulegen. Die Oberfläche sollte fünf Zustände verwalten: den Wallet-Status für Verbindung und Adresse, den Asset-Status für die ausgewählten „From“- und „To“-Tokens, den Amount-Status für die Dezimal-Konvertierung, den Simulations-Status für Quote und minimale Ausgabe sowie den Transaktions-Status für bereit, ausstehend, abgeschlossen oder fehlgeschlagen. Starte mit der Installation von @ston-fi/sdk, @ston-fi/api, @tonconnect/ui-react und @ton/ton. Binde die App mit TonConnectUIProvider ein und verknüpfe die richtige Manifest-Datei. Lade Assets mit StonApiClient und konvertiere anschließend die Benutzereingabe in exakte Blockchain-Einheiten, damit die App präzise Werte verwendet statt Anzeigezahlen. Bevor du die Transaktion erstellst, rufe simulateSwap auf. Es liefert die Route, die erwartete Ausgabe, den minimal erhaltenen Betrag sowie Router-Metadaten, die für die Ausführung benötigt werden. Wenn der Nutzer das Token-Paar oder den Betrag ändert, lösche die vorherige Simulation und berechne sofort neu, damit die UI zur neuesten Quote passt. Sobald die Simulation bereit ist, nutze die zurückgegebenen Routerdaten mit dexFactory, um die finalen Transaktionsparameter zu erstellen. Der Pfad hängt von der Richtung ab: $GRAM zu jetton, $JETTON zu $GRAM oder $JETTON zu jetton. Die Simulation ist das Herzstück des Ablaufs, weil sie definiert, was der Nutzer voraussichtlich erhält und was akzeptiert werden muss, damit der Swap fortgesetzt werden kann. Wenn die angezeigte Quote und die signierte Transaktion nicht übereinstimmen, bricht das Vertrauen. Ein praktischer Ablauf ist einfach: Wallet verbinden, Eingabe- und Ausgabe-Assets auswählen, Betrag eingeben, Swap simulieren, erwartete Ausgabe prüfen und dann die Transaktion über TON Connect erstellen und senden. Erfahre mehr in der STON.fi-App unter app.ston.fi .