How to hide elements in vue

Vue method of hiding elements: 1. Use the "v-if" command to display or hide elements by dynamically adding or deleting DOM elements to the DOM tree; 2. Use "v-show" Instructions to control visibility by setting the display style attribute of DOM elements.

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

vue controls the display and hiding of elements

Solution:

v Both the -if instruction and the v-show instruction can dynamically control the display and hiding of DOM elements based on the value. v-if and v-show are commonly used internal instructions in Vue. The responsibility of the instruction is to change certain special elements when the value of the expression changes. Behaviors are applied to the DOM.

• v-if will directly delete the element

• ##v -show just hides, simply toggling the element's CSS property display.

   <p v-show="showGroup">
        <p class="formTitle">图层组</p >
    </p >

Copy after login

vue.js tutorial"

The above is the detailed content of How to hide elements in vue. For more information, please follow other related articles on the PHP Chinese website!