从另一个组件引用类

Question

我正在尝试在app.js组件中定位sideBar：

class App extends React.Component {
constructor() {
    super();
    //initial state
    this.state = {
        plants: {},
        order: {},
        showSideBar: true,
    };
    this.loadPlants = this.loadPlants.bind(this);
    this.addToOrder = this.addToOrder.bind(this);
    this.showSideBar = this.showSideBar.bind(this);
}

showSideBar(e) {
    e.preventDefault();
    this.sideBar.classList.toggle("show");
    this.setState({
        showSideBar: true,
    })
}

目前它位于cart.js：

render() {
    const orderIds = Object.keys(this.props.order);
    const total = orderIds.reduce((prevTotal,key) => {
        const plants = this.props.plants[key];
        const count = this.props.order[key];
        const isAvailable = true;

        if(isAvailable) {
            return prevTotal + (count * plant.price || 0);
        }
    }, []);
    return(
        <aside className="sideBar" ref={ref => this.sideBar = ref}>
            <div className="order-wrap">
                <h1>Your Cart</h1>
                <ul className="order">
                    {orderIds.map(this.renderOrder)}
                    <li className="total">
                        <strong>Total:</strong>
                        {formatPrice(total)}
                    </li>
                </ul>
                <div className="close-btn" onClick={this.showSideBar}>
                    <i className="fa fa-times"></i>
                </div>
                <input type="submit" value="Place Order"/>
            </div>
        </aside>

关于如何在app.js中正确引用sideBar类的任何想法？ ＆＃34; this.sideBar.classList.toggle（＆＃34;显示＆＃34;）;＆＃34;给我一个错误，说明没有定义classList。