Javascript 如何在react componentWillMount中使用数据设置？

我想在组件渲染之前获取初始数据。
因此，我尝试在componentWillMount中声明更新操作。
虽然状态更改，但当我在componentDidMount确认控制台结果时，结果为空

imageUpload.js

export const IMAGE_UPLOAD = 'IMAGE_UPLOAD';
export function imageUpload(photo) {
  return {
    type: IMAGE_UPLOAD,
    photo
  }
}

Reducers.js

import { IMAGE_UPLOAD } from './actions/imageUpload';

export default function imageUpload(state = {photo: ''}, action) {
  switch(action.type) {
    case IMAGE_UPLOAD:
      return {
        ...state,
        photo: action.photo
      }
    default:
      return state
   }
}

App.js

import photo from './data/photo.json' // photo type: json
import imageUpload from './actions/imageUpload'

componentWillMount() {
  Storage.prototype.setObject = (key, value) => {
    this.setItem(key, JSON.stringify(value))
  }
  Storage.prototype.getObject = (key) => {
    return this.getItem(key) && JSON.parse(this.getItem(key))
  }
  const photoData = localStorage.getObject('photos');
  if(photoData) // data in localStorage
    imageUpload(photoData) // state setting localStorage data
  else // data not in localStorage
    imageUpload(photo) // state setting photo json data
}

componentDidMount() {
  console.log(this.props.photo); // result: blank ( I want result: any value)
}

class App extends React.Component {
  // ...
}

const mapStateToProps = (state) => ({
  photo: state.imageUpload.photos
})

const mapDispatchToProps = (dispatch) =>({
  imageUpload: bindActionCreators(imageUpload, dispatch)
})

export default connect(mapStateToProps, mapDispatchToProps)(App)

我该怎么办？

---

谢谢。

Redux状态更新是异步的，这意味着Redux状态更新需要一些时间。之所以在

componentDidMount

中看不到任何数据，是因为调用该方法时redux异步操作仍未完成

尝试在

组件willreceiveprops

中查找数据。当异步操作完成时，将使用数据调用此方法

因此：

---

mapStateToProps中是否存在键入错误…而不是

photo:state.imageUpload.photos

它应该是

photo:state.imageUpload.photo

如果componentDidMount函数是连接组件的一部分（代码中不清楚），则它的props中没有photo对象。您需要查看子组件及其属性。默认情况下，常规的redux操作及其分派是同步的。如果要利用异步调度，必须使用第三方技术，如或。

componentWillRecieveProps(nextProps) {
    console.log(nextProps.photo);
}