Question

我最近开始学习如何一起使用React-Native和Redux。我在IOS模拟器中遇到了一个错误，我无法弄清楚如何修复，我想知道是否有人曾经看过这个。

这是错误：

提供商不支持动态更改商店。您很可能会看到此错误，因为您已更新到Redux 2.x和React Redux 2.x，它们不再自动热重新加载Reducer。有关迁移说明，请参阅https://github.com/reactjs/react-redux/releases/tag/v2.0.0。

我按照错误消息中提到的链接，但似乎需要我使用Webpack。在引用if(module.hot)的链接中，尝试使用此解决方案时出现以下错误：

无法解析模块

所以我不确定从哪里开始。到目前为止，我的项目非常小。我有index.ios.js，然后是一个包含组件文件夹，商店文件夹和reducer文件夹的app文件夹。结构如下所示：

index.ios.js
应用
- 店
  - index.js
- 组件
  - index.js
- 减速器
  - index.js

这是我的代码：

index.ios.js

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import {
  AppRegistry,  
  StyleSheet,
  Text,
  View
} from 'react-native';

import {configureStore} from './app/store';
import Main from './app/components/Main';

export default class introToRedux extends Component {
  render() {
    return (
      <Provider store={configureStore()}>
        <Main />
      </Provider>
    );
  }
}

AppRegistry.registerComponent('introToRedux', () => introToRedux);

components/Main.js

import React, { Component } from 'react';
import {connect} from 'react-redux';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';

var Main = React.createClass({
    render(){
        return (
            <View>
                <Text>{this.props.text}</Text>
            </View>
        );
    }
});

var mapStateToText = (state) => {
    return {
        text: state.text
    }
}

module.exports = connect(mapStateToText)(Main);

reducer/index.js

module.exports = (state={}, action) => {
    switch (action.type) {
        default: 
            return state;
    }
}

store/index.js

import {createStore} from 'redux';
import reducer from '../reducer';

var defaultState = {
    text: "default text"
}

export var configureStore = (initialState=defaultState) => {
    return createStore(reducer, initialState);
}

对此有任何帮助都很棒！

Answer 1

为什么要导出configureStore()？你可能也是

const initialState = {
    text: "default text"
}

export default function reducer (state=initialState, action) {
    switch (action.type) {
        default: 
            return state;
    }
}

createStore()应执行一次。

index.js

// import stuff

const store = createStore(reducer)

class IntroToRedux extends Component {
  render() {
    return (
      <Provider store={store}>
        <Main />
      </Provider>
    );
  }
}

ReactDOM.render(IntroToRedux, document.getElementById('root'))

<provider>不支持动态更改`store`

1 个答案: