Zenn
Open1

App Router TIPS

khalekhale

「いいねボタン」のコンポーネントからdecreaseLikeサーバアクションをコールする。

export default function ThumbsUpButton({ appUserId, questionId }: ThumbsUpButtonProps) {
  return (
    <Icons.thumbsUp
      className="mr-2 h-4 w-4 text-red-500 transition-transform duration-150 ease-in-out hover:cursor-pointer active:scale-110"
      onClick={() => increaseLike(appUserId, questionId)}
    />
  )
}

以下のようなserver onlyではエラーとなる。use serverが必要。

'server only'

export const increaseLike = async (userId: number, questionId: number) => {
    // 処理
}