It's almost 1 month since you released Vue 3. After your own constant exploration, trial and debugging, I want to give you some humble opinions. Welcome to leave a message to correct me.

This paper mainly compares and contrasts the differences between the two versions from different angles.

For example: nextTick

Vue3.x provides a more detailed API for the creation of custom instructions (similar to the declaration cycle of components).

1, binding? & gt？ Disassembly (before installation)

2. Insert & gt? Installed (after installation)

3、? & gt？ Before update (new, before update)

4. Update & gt? delete

5. Component update? & gt？ Updated (updated)

6、? & gt？ Before unloading (new, before unloading)

7. Unbind & gt? Unloaded (after unloading)

When v-for uses the key attribute, the template tag in Vue2.x reports syntax errors.

In Vue3.x, the key attribute is recommended to improve the efficiency of template rendering;

When v-if and v-for act on an element at the same time:

The priority of v-for in Vue2.x will be higher than that of v-if;

The priority of v-if in Vue3.x will be higher than that of v-for;

Taboo: You can't put v-for and v-if on the same element in Vue3.x, you can only use v-for to nest v-if.

Suggestion: The official suggestion is to use computational properties to improve performance, which is compatible with Vue3.x

In vue3, a new v-slot instruction is added to distinguish it from the previous slot.

The definition of slot is basically the same as that in vue2 before.

Slots are recommended:

When using the default slot (anonymous slot), you can use the same way as using anonymous slot before, or you can use the template method recommended in vue3.

The use of named slots can be inserted into the specified location by using templates.

We know that in vue2, we use v-bind="$attrs "and v-on =" $ Listener" to connect data and events, but in vue3, the v-on instruction was deleted first, and then the properties of these two components were found to be too complicated, so in the current version, the function of $ Attrs V-on = "$ Listener was integrated. $ Listener has been passed as part of $attrs, so you only need to specify v-bind="$attrs "on the composition, so you have the function of passing values and events at the same time.

Next chapter: (2) Vue3.x application API.

Ps: When your strength and talent are not enough to realize your ambition, then calm down and work hard! Pay tribute to yourself and live up to your youth.