Question

您好Stackoverflow第一次发布，如果操作不正确，请提供指导，我目前正在尝试使用weatherApplication进行练习，但是在更新已添加到商店“ focusedIndex”的新属性时遇到问题。

它的工作方式是我从存储在商店中的数组中单击城市。索引用于获取数组中的数据，但我想存储该索引，因为我以后想在googleMap组件中使用它来获取其经度和纬度。

1）在CityFocusContainer.js中，我触发了动作。

2）减速器确实触发了正确的方法并显示了适当的数据。（简单数字-我也用typeof仔细检查了

3）分配传递给状态的新值

4）reducer退出，应用程序的其余部分继续运行，并返回商店的最终状态，focusIndex保持与初始状态（1）不变的状态。

任何帮助将不胜感激，如果有任何疑问，请告诉我

Reducer.js

const initialState = {
isLoading                                  : false, 
currentLocation                            : {},
localWeather                               : {},
weatherList                                : [],
listCounter                                : 1,
focusedCity                                : [],
focusListCounter                           : 1,
focusedCurrent                             : {},
focusIndex                                 : 1 }; 

case 'FOCUS_INDEX'                     :
        console.log("This is Focus Index " + action.fIndex)

return {
            ...state,
            focusIndex    : action.fIndex,
        }

CityFocusContainer.js

import React, { Component } from 'react'
import { connect } from 'react-redux'
import { getWeatherAsync, getAdditionalWeatherAsync } from '../utils/weatherFuncs'
import CityWeather from '../components/CityWeather'
import WeatherForDays from '../components/WeatherForDays'
import { View, Text } from 'react-native'
import GoogleMap from '../components/googleMap';

class CityWeatherContainer extends Component {

async componentDidMount () {

    this.props.setLoading()
    const { navigation } = this.props
    const cityIndex = navigation.getParam('cityListIndex', 'NO-ID') 
    const focusedCity = this.props.cityList[cityIndex - 1]
    this.props.setIndex({ CI : navigation.getParam('cityListIndex', 'NO-ID')});
    const highNoon = "12:00:00"

<--- some more code here ---> 

this.props.loading ? <Text>loading....</Text> : <GoogleMap />

<--- some more code here ---> 

const mapStateToProps = state => {
return {
    cityList         : state.weatherList,
    f_cityList       : state.focusedCity,
    loading          : state.isLoading
}
}
const mapDispatchToProps = dispatch => {
return {
    setLoading       : ()               => dispatch ({type : 'SET_LOADING'}),
    storeCityInFocus : (cityI)          => dispatch ({type : 'FOCUSED_CITY', cityinfo : cityI }),
    storeFocusC      : (focusedCurrent) => dispatch ({type : 'FOCUSED_CURRENT', cFocused : focusedCurrent}),
    resetData        : ()               => dispatch ({type : 'CLEAR_CITY_DATA'}),
    setIndex         : (indexToBeSent)  => dispatch ({type : 'FOCUS_INDEX', fIndex : indexToBeSent}),
}
}
export default connect(mapStateToProps, mapDispatchToProps)(CityWeatherContainer)

googleMap.js

class GoogleMap extends Component {

componentDidMount () {
    console.log("This is the index " + this.props.cIndex)
}

<--- some more code here ---> 

const mapStateToProps = state => {
return {
    cityList         : state.weatherList,
    cIndex           : state.focusIndex
}
}
export default connect(mapStateToProps)(GoogleMap);

Answer 1

case 'FOCUS_INDEX'                     :
        console.log("This is Focus Index " + action.fIndex.CI)

return {
            ...state,
            focusIndex    : action.fIndex,
        }

您到处都有定义为focusIndex的值，但在组件映射中将其称为focusIndex：

const mapStateToProps = state => {
return {
    cityList         : state.weatherList,
    cIndex           : state.focusedIndex
}
}

将组件映射更新为focusIndex，然后重试

Answer 2

谢谢您的帮助，即使现在我不确定我在哪里出错了，即使当我修复所有变量名时也遇到了问题，但是我藏了下来，重新做了我的工作，重新启动了模拟器和缓存，它仍然有效。

Expo / React-Native / React-redux-Reducer不会更新商店

2 个答案: