Visa formuläret på kortet genom att klicka

Följande kod användes för att visa formuläret när användaren klickar på ett kort. Sökvägen till det formulär som ska visas extraheras från webbadressen med funktionen useParams.

import Form from './components/Form';
import PlainText from './components/plainText';
import TextField from './components/TextField';
import Button from './components/Button';
import Panel from './components/Panel';
import { useState,useEffect } from "react";
import {Link, useParams} from 'react-router-dom';
import { AdaptiveForm } from "@aemforms/af-react-renderer";
export default function DisplayForm()
{
   const [selectedForm, setForm] = useState("");
   const params = useParams();
   const extendMappings =
    {
        'plain-text' : PlainText,
        'text-input' : TextField,
        'button' : Button,
        'form': Form
    };


   const getAFForm = async () =>
    {

        const resp = await fetch(`/adobe/forms/af/${params.formID}`);
        let formJSON = await resp.json();
        console.log("The contact form json is "+formJSON);
        setForm(formJSON.afModelDefinition)
    }

    useEffect( ()=>{
        getAFForm()


    },[]);
    return(
       <div>
           <AdaptiveForm mappings={extendMappings} formJson={selectedForm}/>
        </div>
    )
}

Nästa steg

Visa tackmeddelande när formulär skickas

recommendation-more-help
8de24117-1378-413c-a581-01e660b7163e