Проблема с полями формы пользовательского интерфейса awsognito в vue js

Question

Я использую AWSognito и усиливаю в своем приложении vue js. С предопределенными полями все работает нормально.

Я добавил настраиваемые поля в раздел атрибутов пользовательского пула AWS. Эти недавно добавленные поля не отображаются в пользовательском интерфейсе.

Вот мой код для расширения конфигурации и настраиваемых полей.

HTML-код:

      <amplify-authenticator>
     <amplify-sign-up
       slot="sign-up"
       header-text="My Project Sign-Up"
       submit-button-text="Register"
       :formFields="formFields"
     ></amplify-sign-up>
</amplify-authenticator>

Пользовательские поля JSON

      formFields: [
        { type: 'username' },
        { type: 'password' },
        { type: 'email', inputProps: { required: true, autocomplete: 'username' } },
        { type: 'phone_number' },
        { type: 'custom:name' },
      ]

Форма результата

Настраиваемые поля не входят в форму. Может ли кто-нибудь помочь мне решить эту проблему?

Answer 1

Похоже, проблема связана со Stencil. Смотрите это обсуждение.

Предлагаемое решение состоит в том, чтобы изменить formFieldsк formFields.prop.

Например

      <amplify-authenticator>
     <amplify-sign-up
       slot="sign-up"
       header-text="My Project Sign-Up"
       submit-button-text="Register"
       :formFields.prop="formFields"
     ></amplify-sign-up>
</amplify-authenticator>

Это сработало для меня, используя Vue 2.