Автоматически отображать только последнюю тему - PullRequest
Новая
       16

Автоматически отображать только последнюю тему

0 голосов
/ 21 июня 2019

Мне нужно показывать только самый последний контент, размещенный на моем веб-сайте с использованием API, чтобы отображать его на домашней странице моего собственного приложения для мобильных устройств. Но когда я запускаю свое приложение, оно показывает Typeerror: undefined не является объектом this.state.persons [0] .p_pages_title.

Ниже приведен пример моих данных JSON: 

{
statuc: "SUCCESS",
data: - [
- {
p_pages_id: "6591",
p_pages_title: "د شوال شپږ روژې نیول (الحدیث).",
p_pages_author: "تعلیم الاسلام",
p_pages_date: "2019-06-08 05:45:11",

},
- {
p_pages_id: "10122",
p_pages_title: "د رسول اللهﷺ تبسم (الحدیث)",
p_pages_author: "تعلیم الاسلام ",
p_pages_date: "2019-06-04 20:10:43",

},
- {
p_pages_id: "2798",
p_pages_title: "تر درو ورځو زیاته خوابدتیا (الحدیث).",
p_pages_author: "تعلیم الاسلام",
p_pages_date: "2019-06-04 10:25:03",

},
- {
p_pages_id: "3871",
p_pages_title: "د لیلة القدر د شپې دعا (الحدیث)",
p_pages_author: "تعلیم الاسلام ویب پاڼه",
p_pages_date: "2019-05-29 09:06:47",

},
- {
p_pages_id: "10095",
p_pages_title: "د روژې د هري شپې اعلان (الحدیث).",
p_pages_author: "تعلیم الاسلام ویب پاڼه",
p_pages_date: "2019-05-15 05:41:06",

},
- {
p_pages_id: "5357",
p_pages_title: "د ریان دروازه د روژاتي لپاره (الحدیث).",
p_pages_author: "تعلیم الاسلام راډیو",
p_pages_date: "2019-05-12 04:59:24",

},

А вот и код: 

class DailyHadith extends Component {

   constructor(props) {
    super(props);
    this.state = {
      persons: [],
      isLoading: true,

    };
  }

  async componentDidMount() {


    axios
      .get(`address of the json data`)
      .then(res => {
        // console.log(res);
        this.setState({
          isLoading: false,
          persons: res.data.data
        });
      });


  }

// Вот метод визуализации: 

render(){

return (

<Card>


<CardItem>

<Text>{this.state.persons[0].p_pages_title}</Text>

</CardItem>

</Card>
    );
    }
    }

}

1 Ответ

0 голосов
/ 21 июня 2019

Ваши данные имеют поле с именем: p_pages_date, которое можно использовать для получения самых последних данных.Создайте новое состояние как latestData.И вы можете использовать приведенный ниже код для фильтрации последних данных. 

       axios.get(`address of the json data`)
           .then(res => {
             // console.log(res);
             let latestDataValue = {};
             if(res.length){
             c = res.reduce((m,v,i) => (v.p_pages_date > 
              m.p_pages_date) && i ? v : m).ModDate;
            }
            this.setState({
                isLoading: false,
                persons: res.data.data,
                latestData:latestDataValue
            });
         });

Теперь в вашем методе рендеринга вызовите this.state.latestData.p_pages_title вместо this.state.persons [0] .p_pages_title

Надеюсь, это поможет.

...