小编agd*_*dev的帖子

我试图弄清楚如何通知另一个组件有关状态更改.假设我有3个组件 - App.jsx,Header.jsx和SidebarPush.jsx,我只是想做的就是用onClick切换一个类.

因此,单击时Header.jsx文件将有2个按钮将状态切换为true或false.其他2个组件App.jsx和Header.jsx将需要了解这些状态更改,以便只要这些状态发生更改,它们就可以切换类.

App.jsx

import React from 'react';
import Header from 'Header';
import classNames from "classnames";
import SidebarPush from 'SidebarPush';
import PageWrapper from 'PageWrapper';

var MainWrapper = React.createClass({
    render: function() {
        return (
            <div className={classNames({ 'wrapper': false, 'SidebarPush-collapsed': !this.state.sidbarPushCollapsed })}>
                <Header/>
                <SidebarPush/>
                <PageWrapper>
                {this.props.children}
                </PageWrapper>
            </div>
        );
    }
});

module.exports = MainWrapper;

Header.jsx

import React from 'react';
import ReactDom from 'react-dom';


class Header extends React.Component {
    constructor() {
        super();
        this.state = {
            sidbarPushCollapsed: false,
            profileCollapsed: false
        };
        this.handleClick = …

我试图了解一些关于 RxJs 的事情。我想要做的是使用一些 JSON 数据，并在数据传入时立即开始在 DOM 上呈现该数据。我已经设置了流请求、响应和显示。它输出每一个都很好，但它是一次性完成的，而不是随着时间的推移。

我想开始在页面上显示数据，而不是等待整个文件完成然后立即显示，这会造成很长的等待时间。

//Cache the selector
var $resultList = $('.results');

//Gets the JSON (this will not be a static file,just for testing)
var requestStream = Rx.Observable.just("/results.json");

var responseStream = requestStream
    .flatMap(function(requestUrl) {
            return Rx.Observable.fromPromise(jQuery.getJSON(requestUrl))
             });

var displayStream = responseStream.subscribe(
    function(response) {
    //This maps to a Handlebars Template and puts it on the DOM
    $resultList.html(compiledTemplate(response)); 
            },
            function(err) {
                    console.log('Error: %s', err);
             },
             function() {
                    console.log('Completed');
             });




//Sample of the data from the JSON file
Object{
    beginIndex: …