Solve the problem that mounted created and watch are executed twice in nuxt page

Foreword:

When I accidentally checked the Network request in the development, I found that an interface was requested in the created hook function in the page, but when the page was loaded, the interface would request both sides continuously, and then I checked whether there were other places calling the same interface. After checking several times, I found that there was no WTF, and then I printed 1 in created, which was surprising. . . created prints twice. . .

WTF, WTF, WTF, do you have many question marks? ? ? , and then try, not only created will be executed twice, mounted will do, even watch will monitor, hold grass (grass is a kind of plant), here I omit the steps of deleting all kinds of checks for one hour. . .

The following conclusions are drawn:

Type 1:

Unreasonable page layout will lead to execution twice. For example, block-level elements are nested in the elements in the row, and then for or if is used in the block-level elements. If you want to check whether this is the case, you can only delete the code at 1 point, see if the code of that block is deleted and will not be executed twice, and then check and modify it from the root of the disease.

Type 2:

The combination of v-if and v-else will also be performed twice. I tested this one and changed v-if to v-show. . . Just TM.

Type 3:

I used swiper in the page and found that. . . The code of swiper also triggers execution twice. It should be the code of swiper that triggers the rule, and then I wrap 1 div in swiper component. . . Found good, speechless, no rules at all

Type 4:

Not found yet,,, welcome comments to increase

Finally:

Excuse me for using more * * modifiers in this article. . . Because the reason for the problem you can't imagine is really amazing. Don't say it, ask for a compliment! ! !

Additional knowledge: vue. js page loading and executing created, mounted sequence

The created page is loaded before the html is rendered.

mounted Render html before executing.

Dom could not be operated before html template production, but mounted could.