score:0

Accepted answer

you probably don't want to repeat form tag for each input field. to make it work move form tag one level upper, as a wrapper. then - loop through input fields as defined in separate file. my suggestion is to add submit button separately, as a part of contactform (it has a different purpose than other fields - holds no value, etc)

import react, {component} from 'react'
import {contactdata} from './contactformdata'
import {fontawesomeicon} from "@fortawesome/react-fontawesome";
import {faarrowright} from "@fortawesome/free-solid-svg-icons";
import {library} from '@fortawesome/fontawesome-svg-core'
import './contact.css'
import './archivo-regular.ttf'


library.add(faarrowright)

class contactform extends component {
    render() {
        return (
            <div classname="contactformcontainer">
                <form>
                    {contactdata.map((item) => {
                        return (
                            <>
                                <label>{item.label}</label>
                                <br />
                                <input type={item.type} placeholder={item.placeholder} value={item.value} classname={item.class} id={item.id}/>
                            </>
                        )
                    })}
                    <button type="submit">
                        send message <fontawesomeicon icon={faarrowright} />
                    </button>
                </form>
            </div>
        )
    }
}


export default contactform;

Related Query

More Query from same tag