javascript - React.js、JavaScript 通过单击数组中的父元素获取 Img

Question

我正在尝试制作一个用作导航的选择组件。

当我单击菜单列表之一时，clickedValue(img和文本)应该位于按钮元素上。

我找到了一种显示点击文本值的方法，即“e.currentTarget.textContent”，但对于 img，我找不到方法...

我尝试过innerHTML，它显示了字面链接源，但不是实际图像。

我没有写一些你不需要的其他代码，如果这让你烦恼，抱歉xD

state = {
   clickedValue : 'cryptocurrency'
}


handleSelected = (e) => {
    const { clickedValue } = this.state;

    this.setState({
        clickedValue : e.currentTarget.textContent
    })
}

const menu = [{
        link : '/service',
        img : some link,
        title : 'Cryptocurrency'
    },{
        link : '/service/wallet',
        img : some link2,
        title : 'Wallet'
    }, {
        link : '/service/ico',
        img : some link3,
        title : 'Ico'
    }]

<button>Clicked Value which is img and text here</button>
{menu.map(
    (menu) => (
         <li onClick={handleSelected} className={cx('list')}><NavLink exact to={menu.link}><img src={menu.img} alt={menu.title}/>{menu.title}</NavLink></li>
    )
)}

Answer 1

我确信您可以让它按照您想要的方式工作，但为什么不简单地将菜单值传递给 handleSelected ？

<li onClick={() => this.handleSelected(menu)}

为您节省大量时间:)