Some summary of Vuejs

1.Vuejs components

Note here that the components need to be registered and reused, which means

If the error is reversed, it means that the component is used first, but the component is not registered.

Webpack error, use Webpack--display-error-details can be wrong

2. Instruction Keep-alive

Look at the demo at the time to see the meaning of Vue-router written keep-alive keep-alive :
If you leave the switched component in memory, you can preserve its state or avoid re-rendering. You can add a keep-alive directive for this purpose

3. How to make CSS work only in the current component

Each Vue component can define its own css,js, and if you want the CSS in the component to work only on the current component, you only need to style write in scoped , that is:

4.vuejs Loop Insert Picture

5. Bind value to a dynamic property on the Vue instance

For radio buttons, tick box and selection box options, v-model the bound value is usually a static string (for a check box is a logical value):

However, there are times when you want to bind value to a dynamic property of the Vue instance, which can be v-bind implemented, and the value of this property may not be a string. For example, bind the value of a checkbox to a dynamic property of the Vue instance:

After binding here, it is not said that you can click after the switch to change, true false a b because here the definition of the dynamic, A, a, a, B, and can not be directly displayed, at this time

So I need to define a, b in data, that is:

6. Fragment Instances

There are several situations where an instance becomes a fragment instance:

1. The template contains multiple top-level elements.
2. Templates contain only plain text.
3. The template contains only other components (other components may be a fragment instance).
4. A template contains only one element directive, such <partial> as vue-router or <router-view> .
5. The template root node has a Process Control directive, such as v-if or v-for .

These conditions allow the instance to have an unknown number of top-level elements, which will take its DOM content as a fragment. The fragment instance will still render the content correctly. However, it does not have a root node, which $el points to an anchor node, an empty text node (a comment node in development mode).
But more importantly, non-process Control directives on component elements, non-prop attributes, and transitions are ignored because there is no root element for binding:

Fragment instances can also be useful, but it is common for a component to have a root node, which ensures that the instructions and attributes on the component elements are correctly converted and that performance is slightly better.

Some summary of Vuejs