свойство 'длина' не определено - PullRequest
0 голосов
/ 15 апреля 2019

Я следую инструкциям по реакции, но есть ошибка, которая не позволяет мне продолжить, я пробовал все и ничего, даёт неопределенное, но я уже изменил несколько вещей и не смог решить.

erro

Код:

class PostsManager extends Component {
  state = {
    loading: true,
    posts: [],
  };

  componentDidMount() {
    this.getPosts();
  }

  async fetch(method, endpoint, body) {
    try {
      const response = await fetch(`${API}${endpoint}`, {
        method,
        body: body && JSON.stringify(body),
        headers: {
          'content-type': 'application/json',
          accept: 'application/json',
          authorization: `Bearer ${await this.props.auth.getAccessToken()}`,
        },
      });
      return await response.json();
    } catch (error) {
      console.error(error);
    }
  }

  async getPosts() {
    this.setState({ loading: false, posts: await this.fetch('get', '/posts') });
  }

  async deletePost(post) {
    if (window.confirm(`Are you sure you want to delete "${post.title}"`)) {
      await this.fetch('delete', `/posts/${post.id}`);
      this.getPosts();
    }
  }
    return (
      <Fragment>
        <Typography variant="display1">Posts Manager</Typography>
        {this.state.posts.length > 0 ? (
          <Paper elevation={1} className={classes.posts}>
            <List>
           ....

Ответы [ 3 ]

1 голос
/ 16 апреля 2019

Согласен с Glup3, но я бы просто использовал this.state.posts.length вместо проверки, если длина больше 0. Таким образом, если .length не определена или 0, это будет ложь.

{this.state.posts.length ? .... 
0 голосов
/ 16 апреля 2019

Вы хотите отрендерить <Fragment>...</Fragment>, но получаете ошибку.Это связано с тем, что this.state.posts имеет значение null / undefined и длина не может использоваться для таких значений.

Решение: создайте условие if и подождите, пока оно больше не станет нулевым.Glup3

0 голосов
/ 16 апреля 2019

Предполагается, что this.fetch('get', '/posts') работает и возвращает некоторый JSON, который вам необходим для оценки ответа:

async getPosts() {
    const response = await this.fetch('get', '/posts');
    const json = await response.json();
    this.setState({ loading: false, posts: json });
 }

Больше информации здесь на mdn.

...