react求助一个问题

Question

实现效果是一个菜单栏的点击时展开子集菜单，再点击缩起。而且不止一个菜单。代码：//点击事件 clickFunc = (index) => {           }    // render...   {                            list.map((item, index) => {                                return (                                    <div key={index} className="menuBlock">                                        <div className="blockTitle" onClick={this.clickFunc.bind(this, index)} ref={'block'+index}>{item.blockTitle}</div>                                        <div className='blockList on' >                                            <ul>                                                {                                                    item.arr.map((item, index) => {                                                        return (                                                            <li key={index}><a href={item.link} target="_blank">{item.text}</a></li>                                                        );                                                    })                                                }                                            </ul>                                        </div>                                    </div>                                )                            })                        }                        **目前我是打算通过增删class名字来实现，但是这样我得拿到真实的dom，所以我想通过ref来拿到当前点击的dom，再通过它去找兄弟节点'blockList'，给它添加class。这里我用index来标记不同的ref。class名为‘blockList ’的是需要展开项**问题：在点击方法里我该怎么去拿到拼接了下标标量的ref值，或者有什么更好的方法来实现这个效果？