我有一个应用程序结构,主要模仿redux 真实世界的例子,但无法得到这个错误:

Uncaught Error: Invariant Violation: Could not find "store" in either the context or props of "Connect(Home)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(Home)".

以下是我的应用程序结构:

给予

import { render, createFactory } from 'react'
import { Provider } from 'react-redux';
import router from './router/router'
import store from './flux/store'

window.onload = () => {
    render(createFactory(Provider)({store: store},
        () => router
    ), document.body)
};

路由器

import { _ } from 'factories'
import …

我试图使用新的babel版本,并且在尝试使用es2015预设的babel时似乎无法理解箭头功能？

我在pre-babel6上的设置如下:

transform: [['babelify', {sourceMap: false, stage: 0, optional: 'runtime', ignore: ["*.min.js"]}]]

和babel6

transform: [['babelify', {"presets": ["es2015"]}]]

这不起作用.为什么是这样？

编辑

添加"stage-0"摆脱了语法错误消息,但已使我无法通过错误扩展任何内容:'this' is not allowed before super()当我有一个实际的super()调用.

编辑

用一些es7设置一个简单的测试应用程序并试图使用babel-core require hook,同样的问题.

编辑

好的,所以我把它缩小到0级,在babeljs 6 ^中工作方式不同.

这是我注意到的:

运行文件

require("babel-core/register")(
    {
        presets: ["es2015", "stage-0"]
    }
);

require("./app.js");

适用于:

class extendable {
    constructor() {
        console.log('extended')
    }
}

class app extends extendable {

    constructor() {

        super();

        this.method();
        this.method2();
    }

    method() {
        // arrow functions
        setTimeout(() => {
            console.log("works")
        }, 1000) …

我在我的应用程序中使用react-router,我正在寻找一种方法来停止已经在DOM中的组件的重新安装.例如,如果我在URL dashboard,那么我将有一个关联的DashboardComponent挂载.当我转换到dashboard/settings那时我DashboardComponent以及SettingsComponent重新安装到DOM中.我想找到一种干净的方法来只挂载当前URL的子节点.这是真的吗？

路由器:

import { Component, createFactory, PropTypes } from 'react'
import { Route, RouteHandler, DefaultRoute, NotFoundRoute } from 'react-router'

import Home from '../components/Home'
import Dashboard from '../components/Dashboard'
import ViewPlayers from '../components/clubs/ViewPlayers'

let route = createFactory(Route),
    handler = createFactory(RouteHandler),
    root = createFactory(DefaultRoute),
    pageNotFound = createFactory(NotFoundRoute),
    Transitions = createFactory(require('react/lib/ReactCSSTransitionGroup'));

class App extends Component {

    constructor() {

        super();
    }

    render() {

        return (
            Transitions({transitionName: 'fade'},
                handler({key: this.context.router.getCurrentPath()})
            )
        )
    }
}
App.contextTypes = …

我想为所有在ReactCssTransitionsGroup中呈现但不知道如何去做的子项添加交错效果.我看了这个问题,但想尝试使用react过渡组.如果不可能,那么我将做与上述相关问题类似的事情.

我的过渡组件非常简单:

Transitions({component: 'div', transitionName: 'stagger'},
    [1, 2, 3, 4, 5].map(i =>
            div({className: 'pure-u-md-1-3 pure-u-lg-1-4 medium-box demo', key: i})
    )
)

我正在尝试使用具有两个组件的react构建一个简单的应用程序,一个嵌入另一个组件中.子组件是一个缩小的菜单,单击它时会扩展.我希望能够在单击父元素时重新收缩它,或者当子元素失去焦点时.

这是父组件的样子:

import React from 'react';
import MenuBar from './_components/MenuBar.js';

var div = React.createFactory('div');
var menu = React.createFactory(MenuBar);

var HomeComponent = React.createClass({
    render: function() {
        return div({ className: 'page home current', onClick: changeChildState //change the state of the child component to false },
            menu()
        )
    }
});



export default HomeComponent;

这是子组件的样子:

import React from 'react';

var div = React.createFactory('div');

var MenuBar = React.createClass({
    getInitialState: function() {
        return ({menuIsShowing: false});
    }
    showMenu: function() {
        return this.setState({menuIsShowing: true});
    },
    render: function() { …

所以大约一个月前我问了一个关于superagent和发送文件的问题,但根本没有回复.我仍然想知道如何做到这一点,因为我喜欢使用superagent.

我可以使用普通的ajax发送文件:

var fd = new FormData();
        fd.append( 'file', this.refs.File.getDOMNode().files[0] );

        $.ajax({
            url: 'http://localhost:8080/files',
            data: fd,
            processData: false,
            contentType: false,
            type: 'POST',
            success: function(data){
                console.log(data)
            }
        });

但是当我在superagent中尝试同样的事情时,没有任何作用:

var fd = new FormData();
fd.append( 'file', this.refs.File.getDOMNode().files[0] );

Request.post('http://localhost:8080/files')
    .set('Content-Type', false)
    .set('Process-Data', false)
    .attach('file', fd, 'file')
    .end((err, res) => {
        console.log(err);
        console.log(res);
    })

任何人,请告诉我发生了什么事.