MDC - ввод текста не может быть инициализирован

Я настраиваю ввод текста с помощью MDC, но при инициализации с помощью JS появляется следующая ошибка: Ошибка

Это мой код:

// MDC
const mdc = window.mdc;

// Auto init
mdc.autoInit();

$('.mdc-text-fields').each((index, element) => {
  const textField = mdc.textField.MDCTextField.attachTo($(element)[0]);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/material-components-web.min.css">
<script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js">

<div class="mdc-text-field">
    <input class="mdc-text-field__input" type="text">
    <label class="mdc-floating-label" for="class_name">Nome classe</label>
    <div class="mdc-line-ripple"></div>
</div>
Can you help me? Thanks


javascript material-components material-components-web mdc-components
person maicol07    schedule 12.12.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Как ни странно, теперь сработало удаление const textField =...

Это новый код JS:

// MDC
const mdc = window.mdc;

// Auto init
mdc.autoInit();

$('.mdc-text-fields').each((index, element) => {
    mdc.textField.MDCTextField.attachTo(element);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/material-components-web.min.css">
<script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js">

<div class="mdc-text-field">
    <input class="mdc-text-field__input" type="text">
    <label class="mdc-floating-label" for="class_name">Nome classe</label>
    <div class="mdc-line-ripple"></div>
</div>

Ссылка для этого решения: https://stackoverflow.com/a/52021265/7520280

person maicol07    schedule 13.12.2019