在写React的时候发生了一个一个问题。
先说环境：react14.0 + Babel + gulp
显示的效果是这样的。
流程：
响应式页面，左侧茶色在大屏幕显示，小屏幕隐藏
左边和右边的完全独立，不是父子组建的关系。
而我想要通过点击触发器来修改左侧的css样式，进而达成隐藏显示的效果。
我应该在代码里面怎么写呢？
我做过一些想法的验证，然而没有效果：
全局函数，通过refs获取然后调整style，
然而没办法生效，全局函数嘛，this.refs的this指向又是问题，因为两个组件没有任何联系。。。bind和call都试了，都是提示undefined
后来我想可以通过querySelector来找到样式直接操作dom的样式，这样确实是达成了效果，然而并不优雅，react貌似也并不推荐这么做。
希望有大神能给一下解决方法
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
3
566
收藏
其实这个是涉及到不同组件之间的数据传递的一个问题，有两个方法：
使用共同父组件传递数据的方法将子组件的数据传递给共同父组件然后通过父组件将值通过属性传入另外的子组件中。
使用外部数据 Store 来存储这个切换状态，组件内通过读取这个状态来修改样式
这两个方法都能做到尽量在数据层做操作而不涉及到 DOM。如果实在是要用
refs的方法的话也建议在共同父组件中做，这样会更清楚一点。