Promise не не выполняет resolve через .then, а выполняет .catch

15 ноября 2021, 01:00

Помогите, пожалуйста, разобраться в Promise на JS. Весь код здесь: https://jsfiddle.net/cyr7wuaL/

Простейший конвертер валют, задача написать через промисы. На сколько я понял, по If я всегда должен попадать в resolve и через .then выполнять математические действия. А я почему-то попадаю в .catch. Или я неправильно понял смысл промисов, или где-то ошибка.

let inputRub = document.getElementById('rub'),
    inputUsd = document.getElementById('usd');
function getData() {
    return new Promise(function(resolve, reject) { 
    inputRub.addEventListener('input', () => {
      let data = {
        usd:"60"
      }
      if (true) {
        resolve();
      } else {
        reject();
      }
    });
    });
}
getData()
    .then(()=>inputUsd.value = inputRub.value / data.usd)
    .catch(()=>inputUsd.value = "Не ОК");

Answer 1

Если кому-то еще будет нужно решение: нужно функцию getData() поместить в функцию обработчик inputRub, что бы она делала исчисления каждое нажатие. А объект data, нужно передать в resolve(data), что бы данный объект можно было достать из then, ну и получить объект data в методе .then(data) код с решением здесь

let inputRub = document.getElementById('rub'), 
  inputUsd = document.getElementById('usd'); 
 
inputRub.addEventListener('input', () => { 
  function getData() { 
    return new Promise(function(resolve, reject) { 
      let data = { 
        usd: "10" 
      }; 
 
      if (true) { 
        resolve(data); 
      } else { 
        reject(); 
      } 
 
    }); 
  } 
 
  getData() 
    .then((data) => { 
      inputUsd.value = inputRub.value / data.usd 
    }) 
    .catch(() => inputUsd.value = "Не ОК"); 
})

label { 
            display: block; 
            font-size: 30px; 
        } 
        input { 
            width: 300px; 
            height: 50px; 
            font-size: 30px; 
        }

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
    <title>Calc</title> 
</head> 
<body> 
    <label for="rub">RUB</label> 
    <input id="rub" type="text"> 
    <label for="usd">USD</label> 
    <input id="usd" type="text"> 
 
</body> 
</html>

https://jsfiddle.net/mhaoLb1y/