Course lesson

Create a Conditionally Rendered Modal in Vue 3

Vue gives you the convenient v-if property to conditionally render parts of your UI.

Duration
3 min
Access
Included
Transcript
Retained from source evidence

Vue gives you the convenient v-if property to conditionally render parts of your UI.

In this lesson, we will use a ref initially set to false, and create a button that toggles it to true. Then we'll create a div with the class of "modal" and a v-if property that conditionally renders based on our ref