Реагировать на вызов компонента без сохранения состояния - PullRequest
0 голосов
/ 27 ноября 2018

Итак, я пытаюсь получить некоторые данные из серверной части непосредственно перед тем, как мой home компонент рендерит:

Это компонент home:

class App extends Component {
  constructor(props) {
    super(props);
    //asta e o alternativa la componentwillmount dar nu pot sa alterez
    //starea in constructor cica
  }

  componentWillMount(){
    console.log('componentWillMount is executing')
    console.log(store.getState())
    //GetInitialData.bind(this)()
    GetInitialData();
    console.log('component should have executed')
  }

Это мое состояние без состоянияКомпонент, ответственный за выполнение запроса и отправку ответа в хранилище приставок:

import axios from 'axios';
import { get_library } from '../../Redux/actions/Actions' 
import store from "../../Redux/store/Store";
import { connect } from "react-redux";

const mapDispatchToProps = dispatch => {
  return {
    get_library : context => dispatch(get_library(context))
  }
}

const GetInitialData2 = () => {
  console.log('This should work')
}

const GetInitialData = (props) => {

  console.log('Making the GET request')
  //axios.get('http://localhost:8080/try')
  axios({
    method : 'get',
    url : 'http://localhost:8080/getLibrary',
    headers : {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      'Authorization' : 'Bearer ' + getToken(),
    },
  })
  .then(response => {
    console.log('Store in Initial Data')
    console.log(store.getState())
    //store.dispatch(get_library(response.data))
    //this.props.store.dispatch(get_library(response.data))
    props.get_library(response.data)
    //this.setState({ data: response.data });
    console.log('New state now')
    //console.log(this.state)
  })
};

function getToken() {
    // Retrieves the user token from localStorage
    return localStorage.getItem('id_token')
    }


//function GetInitialData (){ connect(null, mapDispatchToProps)(Connected_GetInitialData)}

//export default GetInitialData;
export default connect(null, mapDispatchToProps)(GetInitialData)

export default GetInitialData2;

Моя проблема в том, что я продолжаю получать ошибку props is not defined, которая указывает на компонент home, несмотря ни на что.Даже если я вызываю GetInitialData2 (который только что-то печатает) или GetInitialData.

Есть что-то, чего я не понимаю.Мне не нужно ничего передавать в мою функцию GetInitialData, поскольку все, что она делает, это изменяет хранилище избыточных данных.

EDIT - с промежуточным программным обеспечением:

class App extends Component {

  componentDidMount() {
    console.log('In DidMount, calling function');
    GetInitialData();
    console.log('DidMount should have executed');
  }

И:

const GetInitialData = () => {

  console.log('Making the GET request')
  //axios.get('http://localhost:8080/try')
  axios({
    method : 'get',
    url : 'http://localhost:8080/getLibrary',
    headers : {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      'Authorization' : 'Bearer ' + getToken(),
    },
  })
  .then(response => {
    console.log('Store in Initial Data')
    console.log(store.getState())
    console.log(response.data)
    //store.dispatch(get_library(response.data))
    store.dispatch(get_library(response.data))
    //this.setState({ data: response.data });
    console.log('New store state now')
    console.log(store.getState())
  })
};

function getToken() {
    // Retrieves the user token from localStorage
    return localStorage.getItem('id_token')
    }


export default GetInitialData;

В результате он просто останавливается на store.dispatch и ничего не делает.Все console.logs работают, и я получаю действительный ответ.

Результат ... через слишком много часов: кажется, что он молча терпел неудачу на уровне редуктора, где у меня было:

const initialState = {
  library: {},
  playlist_names: [],
  playlists : [],
  songs : [],
  articles : [],
};

И вместо этого должно было быть: library : [];, ошибка была: TypeError: Invalid attempt to spread non-iterable instance.Я только добился этого, напечатав response.data в консоли и вручную запустив store.dispatch из консоли браузера ... Я до сих пор не понимаю, почему эта ошибка не появилась.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...