Question

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

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

接下来，使用Object.keys（..）获取用户属性的集合。将其分配给属性变量。

使用数组.forEach函数遍历属性，然后在UI中显示属性。提示：*给定的属性，例如* Age，具有一个带有data-age-value属性的对应SPAN元素。您可以使用ES6模板字符串构建针对该属性的SPAN的查询选择器，然后使用它查询DOM。您还希望确保仅在DOM查询成功后才更新UI

我已经尽力了，我的代码没有错误，但是它仍然告诉我我没有以正确的方式来做。请我真的很感谢您的帮助。

    const users = [];
    const getSelectedUser = (userId) => users.find(({id}) => id == userId)   
    const displaySelectedUser = ({target}) => {
        const value = target.value; 
        const user = getSelectedUser(value);
        const properties = Object.keys(user);
        properties.forEach(prop => {
            const span = document.querySelector(`span[data-${prop}-value]`);
            if (span) {
                span.textContent = user[prop];
            };
        });
    };
    const letsCalculateBMI = () => {}
    const powerupTheUI = () => {
        var selectQuery = document.querySelector('.select-text');
        selectQuery.addEventListener('change',displaySelectedUser);

        document.querySelector('#oracle').addEventListener('click',letsCalculateBMI);

    }

    const displayUsers = (users) => {
        var selectElement = document.querySelector('.select-text');

        users.forEach((user) => {
            var selectOption = document.createElement('option');
            selectOption.textContent = user.name;
            selectOption.setAttribute("value",user.id);

            selectElement.appendChild(selectOption);

        })
    }

    const fetchAndDisplayUsers = () => {
        users.push(
        {
            age: 40,
            weight: 75,
            height: 6,
            country: 'Nigeria',
            name: 'Charles Odili',
            id: 'dfhb454768DghtF'
        },
        {
            age: 25,
            weight: 65,
            height: 5,
            country: 'Nigeria',
            name: 'Justice Kelechi',
            id: 'dfhb454768Dghdf'
        }
        );

        displayUsers(users);
    };

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

    startApp();

我希望得到这样的结果

Gender :Male

Age :35

Height :1.3m

Weight :60kg

Country :Nigeria

我只需要填充值，密钥已经在dom中

卡在这段代码中。就像在做错事

0 个答案: