Директива v-html в Vue.js

Всем привет, немного не понимаю суть директивы v-html, что она делает, если уже и так есть различные способы вставки значения в html код с помощью vue.js?

И тебе привет, если ты имеешь в виду интерполяцию, то тут немного разные вещи, если мне не изменяет память, то директива v-html внедряет текст именно как html текст, в то время как используя интерполяцию, html часть будет просто интерпретирована как обычный текст, лучше будет видно на примере:

var decorated_text = {
style:'Этот текст должен выглядеть необычным!'
}

var vueobj = new Vue ({
el:"#example",
data: decorated_text
})

В js части документа мы создаем объект который в себе содержит свойство style, которое в свою очередь содержит в себе span с вписанными inline стилями, далее создается экземпляр vue, который содержит в себе айди элемента к которому прикреплен, и привязанные данные.

<div id="example">
Mustache: {{ style }}


v-html: <span v-html="style">

Как видно при запуске данного кода, в браузере, видно что в случае вставки с помощью двойных скобок ничего толкового не вышло, просто передача текста, но как html этот текст интерпретирован не был, а используя директиву v-html мы получаем нужный эффект, все стили которые прописаны в блоке span успешно применяются, и происходит добавление уже именно как элемента html страницы, как тега.