I am using vue js 2, my SDK is IntelliJ:
I am trying to import very simple html into a vue.js file.
The purpose is for attribute since Vue doesn’t directly seem to support this.
In the markup, I have:
div v-html="message1"></div>
In the data, I have a very simple message1:
message1: '<title>My webpage -- from message1 </title>',
Interestingly, I can display message1 with "moustache" syntax, but it just shows the title tags.
The message1 used by v-html compiles, but it doesn’t appear on the page as rendered.
Is the premise that vue doesn’t directly support correct? I’ve seen complex work-arounds for this, but is there a simple HTML-like way of getting this tag there for simple static text, please? The goal of this is for accessibility purposes.
There is a way to do this, see accepted answer. Also, please read all comments to this answer carefully.
>Solution :
As you can see here, many browsers have a default css style for the title tag.
In Chrome there is:
title {
display: none;
}
You should use another tag or just override the default style.