Skip to content
Back to skills

Wagmi React Write

ASecurity

useWriteContract hook for sending transactions. Use when executing state-changing contract functions in React.

  • 9 stars
  • 0 votes
  • 0 copies
  • 0 views
  • Added September 10, 2026
developmenttypescriptreact

Works with

  • cli

Security analysis

A100/100

Scanned September 10, 2026

npx -y skills add cyotee/indexedex --skill wagmi-react-write --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Wagmi React Write?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Wagmi React Write
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/cyotee-wagmi-react-write/badge)](https://www.skillsdirectory.com/skills/cyotee-wagmi-react-write)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
name: wagmi-react-write
description: useWriteContract hook for sending transactions. Use when executing state-changing contract functions in React.
---

# Wagmi-React Write

useWriteContract and related hooks.

## Basic Write

```typescript
import { useWriteContract, useWaitForTransactionReceipt } from 'wagmi'

function Transfer({ tokenAddress }) {
  const { writeContract, isPending } = useWriteContract()

  const handleTransfer = () => {
    writeContract({
      abi: [...],
      address: tokenAddress,
      functionName: 'transfer',
      args: [recipient, amount]
    })
  }

  return (
    <button onClick={handleTransfer} disabled={isPending}>
      {isPending ? 'Confirming...' : 'Transfer'}
    </button>
  )
}
```

## With Simulation

Validate before sending:

```typescript
import { useSimulateContract, useWriteContract, useWaitForTransactionReceipt } from 'wagmi'

function Transfer() {
  const { data: simData } = useSimulateContract({
    abi,
    address,
    functionName: 'transfer',
    args: [to, amount]
  })

  const { writeContract } = useWriteContract()

  return (
    <button
      onClick={() => writeContract(simData?.request)}
      disabled={!simData}
    >
      Transfer
    </button>
  )
}
```

## Wait for Receipt

```typescript
import { useWriteContract, useWaitForTransactionReceipt } from 'wagmi'

function Transfer() {
  const { data: hash, writeContract } = useWriteContract()

  const { isLoading: isConfirming, isSuccess } = useWaitForTransactionReceipt({
    hash
  })

  const handleTransfer = () => {
    writeContract({ abi, address, functionName: 'transfer', args: [to, amount] })
  }

  return (
    <div>
      <button onClick={handleTransfer}>Transfer</button>
      {isConfirming && <div>Confirming...</div>}
      {isSuccess && <div>Confirmed!</div>}
    </div>
  )
}
```

## writeContractAsync

```typescript
const { writeContractAsync } = useWriteContract()

async function handleTransfer() {
  try {
    const hash = await writeContractAsync({
      abi,
      address,
      functionName: 'transfer',
      args: [to, amount]
    })
    console.log('Transaction hash:', hash)
  } catch (error) {
    console.error('Transaction failed:', error)
  }
}
```

## Parameters

```typescript
import { parseEther, parseGwei } from 'viem'

writeContract({
  abi,
  address,
  functionName: 'transfer',
  args: [to, amount],
  
  // Gas options
  gas: 50000n,
  maxFeePerGas: parseGwei('20'),
  maxPriorityFeePerGas: parseGwei('2'),
  
  // Value for payable functions
  value: parseEther('0.01')
})
```

## Chain ID Validation

```typescript
import { mainnet } from 'wagmi/chains'

// Will throw if not on correct chain
writeContract({
  abi,
  address,
  functionName: 'transfer',
  args: [to, amount],
  chainId: mainnet.id
})
```

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…

Newsletter

Get the weekly list of safe new skills, and the ones we pulled.