В чем разница между v-html и v-text?

Question

У меня был следующий код, используя v-text :

<h1 v-text="content.title"></h1>

Выход:

Фирменное наименование B & C

Итак, я исправил это, используя v-html в предыдущей строке:

<h1 v-html="content.title"></h1>

Вывод:

Фирменное наименование B & C

У меня следующий вопрос: почему он работает, используя v-html , а не v-text ?Я уже прочитал документацию по Vue, но не совсем понимаю разницу.

Answer 1

v-text устанавливает textContent узла. v-html устанавливает innerHTML элемента. & является HTML-сущностью. Если вы хотите, чтобы объекты HTML интерпретировались и заменялись, вам нужно, чтобы они интерпретировались как HTML, а не как текст.