Question

const users = [];

  const getSelectedUser = (userId) => {
    return users.find(({id}) => id === userId);
  };

  const displaySelectedUser = (event) => {
    const { target } = event;
    const user = getSelectedUser(target.value);
    const properties = Object.keys(user);


  for(const property of properties) {

    /* Query the document for a span element with the data attribute
    corresponding to this property**/
    const valueSpan = document
    .querySelector(`.details span[data-${ property }-value]`)

    /* If span element found, update it's text with the value of 
    this user property */
    if(valueSpan) {
        valueSpan.innerText = user[property]
    }
  }
};

  const letsCalculateBMI = () => {

  };

  const powerupTheUI = () => {
    const button = document.querySelector('#oracle');

    const select = document.querySelector('.select-text');

    select.addEventListener('change', displaySelectedUser);

    button.addEventListener('click',letsCalculateBMI);
  };      

  const displayUsers = (users) => {
    users.forEach(user => {
    const select = document.querySelector('.select-text');
    const option = document.createElement('option');

    option.text = user.name; 
    option.value = user.id;
    select.appendChild(option);
    });
  };
  const fetchAndDisplayUsers = () => {
    users.push(
      {
      age: 40,
      weight: 75,
      height: 6,
      gender:'male',
      country: 'Nigeria',
      name: 'Charles Odili',
      id: 'dfhb454768DghtF'
      },
      {
      age: 43,
      weight: 88,
      height: 6,
      gender:'male',
      country: 'canada',
      name: 'uchay',
      id: 'statutory'
      }
    );

    displayUsers(users);
  };

  const startApp = () => {
    powerupTheUI();
    fetchAndDisplayUsers();
  };

  startApp();
</script>

在运行我的代码时，它显示一条错误消息；

“创建一个“ displaySelectedUser”函数，以使用选定的“用户”属性更新UI。有关详细信息，请参见说明”。

和指导性含义；回想一下displaySelectedUser函数被称为事件处理程序。这意味着在触发DOM事件时它将接收一个事件对象。

更新displaySelectedUser函数，并将预期事件参数解构为仅目标属性。

接下来，displaySelectedUser应该调用具有目标的某个特定属性的getSelectedUser，该属性表示更改事件中SELECT元素的选定值。如果您不知道有问题的酒店，可以随时进行谷歌搜索。最后，将.getSelectedUser调用的结果分配给用户变量。

请帮助我纠正不足之处

请为这个面向ES6的js

0 个答案: