js 渲染json数据渲染不出来

问题描述

jp1Warper获取的的值是个空,这个想不通为什么?
然后src="${item1.pic}"也报错说未截取

问题出现的环境背景及自己尝试过哪些方法

相关代码

function renderMarket(list = []) {
    const item1 = list[0];
    const item2 = list[1];
    const jp1Warper = document.querySelector(".rax-view-v2 FloorModule--tmcsModule--27mV5Wq");
    let item1Html = `
    <div class="rax-view-v2 FloorModule--tmcsContentItem--c31nDTr"><a
              href="https://item.taobao.com/item.htm?id=642368100100&amp;scm=1007.12144.81309.73136_0_0&amp;pvid=c81c5f27-cd5f-4e65-8d53-816ede584500&amp;utparam=%7B%22x_hestia_source%22%3A%2273136%22%2C%22x_object_type%22%3A%22item%22%2C%22x_hestia_subsource%22%3A%22default%22%2C%22x_mt%22%3A8%2C%22x_src%22%3A%2273136%22%2C%22x_pos%22%3A1%2C%22wh_pid%22%3A-1%2C%22x_pvid%22%3A%22c81c5f27-cd5f-4e65-8d53-816ede584500%22%2C%22scm%22%3A%221007.12144.81309.73136_0_0%22%2C%22x_object_id%22%3A642368100100%2C%22tpp_buckets%22%3A%222144%230%2381309%230%22%7D"><img
                lazyload="true" quality="normal" data-once="true"
                src="${item1.pic}"
                data-before-current-y="736" data-appeared="false" data-has-appeared="true" data-has-disappeared="true"
                style="width: 220px; height: 220px; border-radius: 18px;">
              <div class="FloorModule--mask--26Ahf9Q"></div>
              <div class="FloorModule--tmcsName--19MBfMf">${item1.itemName}</div>
              <span class="rax-text-v2 FloorModule--tmcsPrice--1dbgcpg">¥8.9</span>
            </a></div>`
    jp1Warper.innerHTML = item1Html + jp1Warper.innerHTML;
}

ajaxPromise({
    url: "http://localhost:9000/api/jp1"
}).then((res) => {
    console.log(res);
    renderMarket(res.data);
})
阅读 1.8k
1 个回答

document.querySelector(".rax-view-v2 FloorModule--tmcsModule--27mV5Wq") 这个 selector 有点问题,FloorModule--tmcsModule--27mV5Wq 没有任何前缀,应该是个 Tag,但显然这不是一个 Tag 的命名,这里应该是 .FloorModule--tmcsModule--27mV5Wq 吧,就是 class?

"${item1.pic}" 的错误要看 res 的结果是啥样,console.log("remote result: ", res.data) 打印出来看看

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题