不变违规:找不到“存储” React Native

时间:2019-04-24 13:13:50

标签: react-native redux react-redux redux-thunk

我在本机反应中使用redux遇到以下错误

  

不变违反:不变违反:在以下位置找不到“存储”   “ Connect(Lista)”的上下文。可以将根组件包装在   ,或将自定义React上下文提供程序传递给和   连接中对应的React上下文使用者到Connect(Lista)   选项。

我的代码如下

SettingStore

import {createStore, applyMiddleware} from 'redux';
import Reducers from './Reducer'
import thunk from 'redux-thunk'

export default SettingStore = () => {
    let store = createStore(Reducers, applyMiddleware(thunk))
    return store
}

我的索引减少器

import {combineReducers} from 'redux';
import loginreducer from './login.reducer'

export default combineReducers({
    login: loginreducer,

})

我的索引操作

import {FETCHING_GETDATA_PARVU} from '../Constante'
import {GetParv} from '../Api/Parvularia.api'



export const getParvuSuccess = (data) => {
    return {type: FETCHING_GETDATA_PARVU, data}
}

export const GetParvu = () => {
    return (dispatch) => {

        dispatch(getData())

        GetParv(1)
        .then(([response, json]) => {
            dispatch(getParvuSuccess(json))
        })
        .catch((error) => console.log(error))
    }
}

这是我的减速机的maintab.reducer

import {FETCHING_GETDATA_PARVU} from '../Constante'

const initialState =  {
    data: [],
    isFeching: false,
    error: false
}

export default dataReducer = (state = initialState, action) => {
    switch(action.type) {
        case FETCHING_GETDATA_PARVU:
            return {

                ...state,
                data: action.data,
                isFeching: false
            }        
        default:
        return state
    }
}

这是我的redux结构的app.js

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View } from 'react-native';
import {Provider} from 'react-redux';
import Lista from '../screens/Educadora/Lista';
import SettingStore from './SettingStore'

let store = SettingStore()


const Ap = () => (
  <Provider store={store}>
     <Lista/>
  </Provider>
)

export default Ap;

最后一部分使我更加怀疑,我认为这是我的错误,但我不知道为什么我在React Native中是新手

修改

这是我要显示使用redux进行查询的地方

        import { connect } from 'react-redux'
        import {GetParvu} from '../../Redux/Actions'

       class Lista extends React.Component {
         componentWillMount() {
          this.props.GetParvu()
         render(){
         return(algoaca)
           }
        }
       }
const mapStateToProps = state => {
  return {
      parvu: state.data
  }
}

const mapDispatchToProps = dispatch => {
  return {
      GetParvu: () => {
          return dispatch(GetParvu(1))
      }
  }
}
AppRegistry.registerComponent('EqualsMobile', () => Lista);
export default connect(mapStateToProps, mapDispatchToProps)(Lista);

1 个答案:

答案 0 :(得分:0)

您以错误的方式连接了组件。 <div class="col-md-12"> <label for="name">{{ __('Name') }}</label> <input id="name" type="text" class="form-control{{ $errors->has('name') ? ' is-invalid' : '' }}" name="name" value="{{ old('name') }}"> @if ($errors->has('name')) <span class="invalid-feedback" role="alert"> <strong>{{ $errors->first('name') }}</strong> </span> @endif </div> 高阶组件,它以connect()作为参数将商店映射到您的组件。

您可以像这样在组件中使用它。

mapStateToProps