v-html

Last updated

What is v-html?

The v-html directive is similar to the v-text directive, but the difference is that v-html renders its content as HTML. This means that if you pass an HTML element it will be rendered as an element and not plain text. Since the content is render as HTML, it can pose a security risk if the content contains malicious JavaScript code. For this reason you should never use this directive in combination with user input, unless the input is first properly sanitized.

Example

<template>
  <p v-html="'<h1>Text</h1>'"></p>
</template>

Free resources to learn v-html

More in stage 7: Forms Handling

v-html: common questions

Can I learn v-html in Hindi?

This lesson is written in English. Once you sign in, open it in the interactive course and ask the AI tutor to explain v-html in Hindi or Hinglish. The tutor answers from this lesson’s own text, so it stays on the syllabus, and it runs on your own Google, OpenAI or Anthropic key.

Is this v-html tutorial for beginners?

It is lesson 28 of 84 in the free Vue roadmap, in stage 7, Forms Handling. If you are new to Vue, start from stage 1 and come back here in order; if you already know the earlier stages, this lesson stands on its own.

Still confused? Ask me