我有一个表单,但这些按钮上的功能不起作用。我正在使用 axios 来执行 post 请求。这与儿童布局有关吗?命名文件?我的子布局没有 body 或 main 标签吗?
主要布局
import { Inter } from "next/font/google";
import Head from 'next/head';
import "./globals.css";
const inter = Inter({ subsets: ["latin"] });
export const metadata = {
title: "Company Dashboard",
description: "",
};
export default function DashboardLayout({ children }) {
return (
<div className="mainContent">
<Head>
<title>{metadata.title}</title>
<meta name="description" content={metadata.description} />
</Head>
<header>
{/* Header content goes here */}
</header>
<body>
<div className="leftMenu">
<nav>
<a href="/"><button>Home</button></a>
<a href="/admins"><button>Admins</button></a>
<a href="/employees"><button>Employees</button></a>
<a href="/clients"><button>Clients</button></a>
<a href="/cars"><button>Cars</button></a>
</nav>
</div>
<div className="leftContent"></div>
<div className="middleContent">{children}</div>
<div className="rightContent"></div>
</body>
</div>
);
}
有问题的代码
'use client'
import React from "react";
import axios from 'axios';
export default function employees(){
const formDataClass = {name:'',surname:'',email:''}
async function login() {
try {
const response = await axios.post("URL",formDataClass);
alert(formDataClass.name);
} catch (error) {
console.log(error);
}
}
return(
<div className="content">
<div><h1>Seja Bem Vindo ao Sistema de Gestão V1.0</h1></div>
<div className="formulary">
<div><h3>Formulário de Empregados</h3></div>
<div>
<form>
<input onChange={(e)=>formDataClass.name=e.target.value} placeholder="Insert Your Name"></input>
<input onChange={(e)=>formDataClass.surname=e.target.value} placeholder="Insert Your Surname"></input>
<input onChange={(e)=>formDataClass.email=e.target.value} placeholder="Insert your Email"></input>
<div className="formButtons">
<button type="button">Save</button>
<button type="button" onClick={login()}>Submit</button>
</div>
</form>
</div>
</div>
</div>
);
}
我确实尝试了一切并期望按钮能够触发 axios post
尝试以下其中一项?
<button type="button" onClick={login}>Submit</button>
<button type="button" onClick={() => login()}>Submit</button>