A
A
Aleksandr2018-05-28 14:20:39
Vue.js
Aleksandr, 2018-05-28 14:20:39

Block sorting based on date?

Hello, please tell me, is it possible to somehow sort the data by blocks depending on the date?
An example of what is needed

"data": [
    {
        "datetime": "2018-05-28 21:33:55",
        "text": "Voluptatem culpa cumque nam sint eos. Cumque occaecati sed ipsam atque quo fugiat qui. Delectus sed incidunt voluptate sunt sint est. Id ad aspernatur hic. Ab illo corrupti aspernatur quo aut.",
        "type": 1
    },
    {
        "datetime": "2018-05-27 07:54:21",
        "text": "Sunt deserunt fugit similique facere enim possimus. Occaecati est accusamus temporibus sit omnis fugit labore. Sit cumque recusandae magnam sint et aliquid nam beatae.",
        "type": 1
    },
    {
        "datetime": "2018-05-26 08:12:57",
        "text": "Accusantium nihil consectetur ab ea quia velit. Labore non iusto culpa dolor non ex earum. Rerum qui error soluta quo est sed perferendis. Ad aperiam animi id dolor inventore.",
        "type": 1
    }
],

There is such an array of data.
And there is such a layout
<div class="right_menu_block">
    <div class="right_menu_block_title">Сегодня</div>
    <div class="right_menu_item normalItem" v-for="(item, index) in notifications" :key="index">
        <div class="right_menu_item_left">
            <div class="right_menu_item_left_icon"></div>
        </div>
        <div class="right_menu_item_right">
            <a href="#" class="right_menu_item_right_text">
                {{ item.text }}
            </a>
            <div class="right_menu_item_right_time">{{ item.datetime }}</div>
        </div>
    </div>
</div>
<div class="right_menu_block">
    <div class="right_menu_block_title">Вчера</div>
    <div class="right_menu_item normalItem" v-for="(item, index) in notifications" :key="index">
        <div class="right_menu_item_left">
            <div class="right_menu_item_left_icon"></div>
        </div>
        <div class="right_menu_item_right">
            <a href="#" class="right_menu_item_right_text">
                {{ item.text }}
            </a>
            <div class="right_menu_item_right_time">{{ item.datetime }}</div>
        </div>
    </div>
</div>

Is it possible to somehow sort the data from the array by these blocks, depending on the date?
That is, 2018-05-28 goes to the "Today"
block To the "Yesterday" block 2018-05-27

Answer the question

In order to leave comments, you need to log in

1 answer(s)
0
0xD34F, 2018-05-28
@Sashjkeee

Is it possible to somehow sort the data from the array by these blocks, depending on the date?
That is, 2018-05-28 goes to the "Today"
block To the "Yesterday" block 2018-05-27

Yes, easily - make several computed properties corresponding to the desired days, a simple array filtering by date. And in each of the blocks, use the corresponding property instead of the original array.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question