Remember a front-end bug: Duplicate data in the front-end vue list query

​Recent development encountered a strange problem: when the page list is paged and queried, many pieces of exactly the same data appear. Problem, data duplication:

image-20210607204128429

In the request result of the front-end page, it is found that the data obtained in the Response in the Network is normal, but the data in the Preview is duplicated

Normal data:

image-20210607204819979

There are multiple duplicate data in the 10 pieces of data paged in Preview

image-20210607205118575

After combing:

The preview in NetWork is wrong, but the value of response is correct.

Use Postman to make a request and find that the request value is also correct, then the problem may lie in the front end.

Reason for inquiry:

In Preview, the console will automatically convert the sent json data into javascript object format ;

The Number type in JavaScript cannot fully represent the Long type number. When the Long length is greater than 17 digits, there will be a problem of loss of precision, and some browsers will convert it to 0 for display if the length exceeds 17 digits.

solve:

1. Adjust the length of the form id field

2. Change the long type to String type in the background

Combined with reality, I chose to adjust the id length, and the problem was solved.

Since the database id is self-incrementing, the default initial value of the table id is set too large when the database script is migrated, resulting in subsequent ids with values ​​greater than 17 digits, loss of precision during front-end processing, and data duplication;

Problem script/error source: delete or give a small initial value

image-20210607210609678

Guess you like

Origin blog.csdn.net/SHUKAI618/article/details/117674884