Добавление значения по умолчанию к html элементу ввода останавливает функцию увеличения / уменьшения - PullRequest
Новая
       31

Добавление значения по умолчанию к html элементу ввода останавливает функцию увеличения / уменьшения

1 голос
/ 25 февраля 2020

Вот одна строка моей таблицы:
enter image description here

В последнем столбце Quantité пользователь должен увеличивать / уменьшать это поле и значение будет увеличиваться или уменьшаться соответственно.

Я достиг этого, добавив элемент input в последний столбец и сделав его type: number. Функция увеличения / уменьшения добавляется автоматически.
Это намного проще и проще, чем делать две кнопки и всю дополнительную боль, которая будет go с этим. 

  <input
                                type="number"
                                className="form-control"
                                id="qte"
                                min="0"
                                max="200"
                              />

В любом случае, поскольку исходные значения будут получены из базы данных, я должен установить значение по умолчанию для этого последнего столбца: 

 value="5"

Но когда я ничего не делаю происходит, когда я нажимаю на увеличение / уменьшение в поле ввода.
Есть идеи, почему это происходит и как это исправить?

1 Ответ

0 голосов
/ 25 февраля 2020

Если вы пытаетесь реализовать это приложение React, замените value на defaultValue. Проверьте реакцию do c, чтобы узнать больше о неконтролируемых компонентах Здесь . Проверьте фрагмент 

class Hello extends React.Component {
 
  render() {
    return ( 
    <div> <p>Input React Sample</p>
    <input type="number" min="0" max="100" defaultValue="5"/>
    </div>
    
    );
  }
};

ReactDOM.render( < Hello / > , document.getElementById("app_root"));
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/15.2.0/react-dom.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.25/browser-polyfill.min.js"></script>
</head>

<body>
  <div id="app_root"></div>

  <script type="text/babel">

  </script>
</body>

Если проблема в html, значение по умолчанию не требуется, просто добавьте value="your_initial_value"

<input type="number" min="0" max="100" value="5" />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...