javascript - If a page has no data and has data, different content will be displayed. What should the front end do?

Question

Question 1:
For example, it is an order page. When I do not have an order, I display a picture to guide the user to choose the product of their choice. The content will only appear here after the user places an order and pays.

I am using vue to write the page, so I make virtual json data and then test whether the page I want can be displayed normally with or without data.

Is this the right thing to do, or what should I do?

Question 2:
For example, if it is a login and logout, how should we consider this?

I am self-taught. It still bothers me how to implement these places with a lot of interactions. Please give me some advice. . .

Answer 1

After getting the data, make a judgment,

if (data.length) {
    // 这里使用数据
}

There is also judgment in html

<p v-if="data.length">展示数据</p>
<p v-else>提示图片信息</p>

Answer 2

1. For example, if the order list is a list, you can directly judge it through v-if(list.length)

2. Login: The user enters the account and password and transmits it to the backend - the backend returns the token after passing the verification - the frontend stores it locally, just bring the token with each request; exit: the backend returns and after the exit is successful, the frontend clears the local storage token, and return to the login page