Question

我有一个api端点表单，在其中获取如下数据。我将如何访问值title，short_title等。

 blog: {
    paginations: true,
    isLoading: false,
    particularBlog: [],
    count: 13,
    next: 'http://127.0.0.1:8000/api/blog/all-blog/?page=2',
    previous: null,
    results: [
      {
        id: 47,
        user: 1,
        title: 'adasd',
        short_title: 'asd',
        publish: '2019-09-16',
        slug: 'adasd',
        comments_count: 0,
        likes_count: 0
      },
      {
        id: 46,
        user: 1,
        title: 'adasda',
        short_title: 'asdas',
        publish: '2019-09-16',
        slug: 'adasda',
        comments_count: 0,
        likes_count: 0
      }
    ]
  },

我所做的是

<div>{
       this.props.blog && Object.keys(this.props.blog).map((key) => {
       return <p>{this.props.blog.results[key]}</p>
     })
}</div>

，但是给出错误，指出未定义的分页。有人可以指出我在这里做错了什么吗？

Answer 1

发生了什么事

Object.keys(this.props.blog).map((key) => {正在获得keys的{{1}}，而this.props.blog试图使用this.props.blog.results[key]的键来访问results的属性。

您应该做的是另外一个blog与.map的{{1}}

OR

我认为您要尝试的是列出Object.keys数组上的所有属性，所以这是您可以做的

this.props.blog.results

您在this.props.blog.results数组上进行this.props.blog && this.props.blog.results && this.props.blog.results.map(result=> <p>{result.short_title}</p>并显示.map。

Answer 2

blog.results.map(el => (<div>{el.short_title}</div>))

如何访问另一个对象内的对象的属性

2 个答案: