How to use async/await in client components
Unanswered
Asian paper wasp posted this in #help-forum
Asian paper waspOP
I am trying to add client side functionality to my SSR component but I get this error. What should I do, is there a workaround?
13 Replies
Asian paper waspOP
Code:
"use client";
import React from "react";
import getEntityPage from "./getEntityPage";
import Image from "next/image";
type Props = {
entityType: string;
entityId: string;
};
export default async function EntityPage(props: Props) {
const { entityType, entityId } = props;
const data = await getEntityPage(entityType, entityId);
function showMoreButton(
e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>
) {
const { parentElement } = e.currentTarget;
if (parentElement!.classList.contains("show-all")) {
parentElement!.classList.remove("show-all");
} else {
parentElement!.classList.add("show-all");
}
}Asian paper waspOP
Can you explain it a little more? @joulev
@Asian paper wasp Can you explain it a little more? <@484037068239142956>
I gave you a link to a message with a code example, follow it
Asian paper waspOP
Oh I didn't know it was a link, thanks
Is this something that will change? Because it says "async/await is not YET supported in Client Components"
@Asian paper wasp Is this something that will change? Because it says "async/await is not YET supported in Client Components"
I can’t say for sure whether it will change or not, but i personally cant imagine how a client async component can work
In normal circumstances
Though the react team has talked about potential usability of async client components in client-side routers
Asian paper waspOP
Hmm, is this problematic for SEO?
Because we are passing the data to a client side component
Client components are prerendered so SEO is fine
Asian paper waspOP
Ok thanks