Вопросы Теги

потому что он говорит мне ошибку, что “latestNews.slice is not в function”?

Я использую React и компонент Home возвращает мне ошибку, которую он говорит latestNews.slice is not a function в моем случае latestNews - array проблема появилась, когда он заменит const latestNews = api.latest(); из-за условного const latestNews = (await this.props.query) ? api.busqueda() : api.latest(); это jsx home.

import React, { Component } from "react";
import Grid from "@material-ui/core/Grid";
import Skeleton from "react-loading-skeleton";

import Card from "../components/Card";
import api from "../utils/api";
import "./_home.scss";

class Home extends Component {
  constructor(props) {
    super(props);

    this.state = {
      isLoading: false,
      latestNews: [],
      searchQuery: ""
    };
  }

  async componentDidMount() {
    this.setState({ isLoading: true });
    const latestNews = (await this.props.query) ? api.busqueda() : api.latest();
    // this.props.query prop a home
    //const latestNews = api.latest();

    this.setState({ latestNews: latestNews.slice(0, 10), isLoading: false });
  }

  render() {
    const { isLoading, latestNews } = this.state;

    return (
      <div>
        <Grid
          container
          spacing={3}
          align="center"
          style={{ marginTop: "10px" }}
        >
          {isLoading &&
            Array.from({ length: 10 }, (_, index) => (
              <Grid item xs={12} lg={4} key={index}>
                <Skeleton width={282} height={337} />
              </Grid>
            ))}

          {latestNews.length > 0 &&
            latestNews.map(latestNew => (
              <Grid item xs={12} lg={4} key={latestNew.news_id}>
                <Card data={latestNew} />
              </Grid>
            ))}
        </Grid>
      </div>
    );
  }
}

export default Home;

и это - то, что у меня есть в api 

import dayjs from "dayjs";

const BASE_URL = "--->aqui--va--la--API_URL";

const getActualDate = () => dayjs().format("YYYY[-]MM[-]DD");

const api = {
  latest: async (date = getActualDate()) => {
    try {
      const response = await fetch(`${BASE_URL}/latest/${date}`);
      const data = await response.json();

      return data;
    } catch (error) {
      console.error(error);
    }
  },
  category: async (categoryId = "") => {
    try {
      const response = await fetch(`${BASE_URL}/news/category/${categoryId}`);
      const data = await response.json();

      return data;
    } catch (error) {
      console.error(error);
    }
  },
  busqueda: async (searchId = "") => {
    try {
      const response = await fetch(`${BASE_URL}/news/busqueda/${searchId}`);
      const data = await response.json();

      return data;
    } catch (error) {
      console.error(error);
    }
  }
};

export default api;
0
задан 07.11.2019, 18:15
1 ответ

Ошибка должна состоять в том, что для, когда он становится setState, переменная latestNews не array и следовательно не считает определенной одну funciГіn slice, конечно по отношению к этой точке ты имеешь объект (незаконченное обещание).

Ты recomendarГ, - чтобы менять немного ее lГіgica для того, чтобы в API ты получил flag (this.props.query) и в зависимости от стоимости ты возвратил fetch, который применяется для того, чтобы ты смог использовать что-то asГ - с компонента. 

api.metodo(this.props.query)
    .then(res => res.json())
    .then(res => {
        this.setState({ latestNews: res.slice(0, 10), isLoading: false });
    })
1
ответ дан 01.12.2019, 12:21
  • 1
    < code> async componentDidMount () { this.setState ({ isLoading: true }); const latestSearch = api .busqueda (this.props.query) .then (домашнее животное = > res.json ()) .then (домашнее животное = > { this.setState ({ latestNews: res.slice (0, 10), isLoading: false }); }); const latestNews = (await this.props.query)? latestSearch: api.latest ();//this.props.query prop в home//const latestNews = api.latest ();//this.setState ({ latestNews: latestNews.slice (0, 10), isLoading: false }); } < / code> – CeciResponde 07.11.2019, 22:02
  • 2
    он дает мне другую ошибку, которую говорит Cannot read property ' json' of undefined, который не может читать json – CeciResponde 07.11.2019, 22:03
  • 3
    также он говорит мне, что мой array не определен Cannot read property ' slice' of undefined – CeciResponde 07.11.2019, 22:06
  • 4
    Тебе говорит Cannot read property ' json' потому что, если уже ты возвращаешь response.json () с API не необходимо помещать это в компонент. – Hamid Pinilla 08.11.2019, 14:22
  • 5
    Podrí схвати обновлять твой API, чтобы видеть нынешнее состояние, в котором это у тебя есть. но я предполагаю, что он, потому что методы в API ты считаешь их определенными как async и у тебя есть try catch внутри. Измени это так что у тебя была funció n, который возвращает такой fetch, ты убеждаешься, что он возвращает обещание, которое ты можешь соединять в компоненте с then, когда эта решится – Hamid Pinilla 08.11.2019, 15:38

Теги

Похожие вопросы