Shulou(Shulou.com)06/03 Report--

This article mainly introduces what are the differences between instructions and components in vuejs, which can be used for reference by interested friends. I hope you can learn a lot after reading this article.

The difference: a component generally refers to a separate entity, and the relationship between components is usually a tree, while an instruction is a Decorator mode that overrides the default behavior of a component, or enhances it to get additional functions, generally speaking, several instructions can be superimposed on the same component to make it get multiple functions.

The operating environment of this tutorial: windows7 system, vue2.9.6 version, DELL G3 computer.

The difference between instructions and components in vuejs

A component generally refers to a separate entity, and the relationship between components is usually a tree.

An instruction is a Decorator pattern that overrides the default behavior of a component or enhances it to gain additional functions. Generally speaking, several instructions can be superimposed on the same component to achieve multiple functions. Some instructions rely on the components they apply to implement certain interfaces, such as transition instructions in vue that rely on a bunch of hooks such as enter, leave, and so on.

Of course, there are some powerful instructions in vue, such as v-if, v-for, which even create or delete components.

For example, the following design:

Gallery is a photo album component.

Transition is an animation instruction.

ClickLogger is an instruction to hit the click log.

Overlay Animation and ClickLogger on Gallery to make it have an animated transition effect when switching, and log automatically when you click.

Thank you for reading this article carefully. I hope the article "what are the differences between instructions and components in vuejs" shared by the editor will be helpful to you. At the same time, I also hope you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.