if you only need email and password fields in sign up and sign in page and you want to customize labals .....
<AmplifyAuthenticator>
<AmplifySignIn
headerText="Custom form"
formFields={[
{
type: 'username',
label: 'Custom Username Label',
placeholder: 'custom username placeholder',
required: true,
handleInputChange: (event, cb) => {
console.log('custom username field');
//perform any actions needed
cb(event);
},
},
{
type: 'password',
label: 'Custom Password Label',
placeholder: 'custom password placeholder',
required: true,
handleInputChange: (event, cb) => {
console.log('custom pwd field');
cb(event);
},
},
]}
slot="sign-in"
/>
<AmplifySignUp
headerText="Custom form"
formFields={[
{
type: 'username',
label: 'Custom Username Label',
placeholder: 'custom username placeholder',
required: true,
handleInputChange: (event, cb) => {
console.log('custom username field');
//perform any actions needed
cb(event);
},
},
{
type: 'password',
label: 'Custom Password Label',
placeholder: 'custom password placeholder',
required: true,
handleInputChange: (event, cb) => {
console.log('custom pwd field');
cb(event);
},
},
]}
slot="sign-up"
/>
<AmplifySignOut></AmplifySignOut>
</AmplifyAuthenticator>
Amplify UI Components for react 有两种
1是legacy的，2也有，不要搞混了，都有 withAuthenticator
legacy 的withAuthenticator 支持 通过signUpConfig的signUpFields 来自定义sign up 页面
2 需要
https://docs.amplify.aws/ui/auth/authenticator/q/framework/react#withauthenticator
https://docs.amplify.aws/ui/auth/authenticator/q/framework/react#customization