Vue.js v-модель для больших HTML

Question

У меня есть собственный текстовый редактор wysiwyg, где вы можете добавить изображение в base64, чтобы вывод был очень жирным :) Проблема заключается в том, когда я пытаюсь инициализировать свой компонент с ранее сгенерированным HTML:

<text-editor name="content" v-model="{{ $page->content }}"></text-editor>

Данная ошибка неясна: Error compiling template ... FULL TEMPLATE ... (found in <Root>)

Я пытался выйти из html с помощью html_entity_decode, htmlentities, htmlspecialchars, но он не работает лучше ...

Answer 1

v-model является синтаксическим сахаром для:

<text-editor name="content" :value="{{ $page->content }}" @input="{{ $page->content }} = $event.target.value"></text-editor> 

Если вы замените {{ $page->content }} для содержимого HTML (как это делает PHP), вы увидите, что оно не работает:

<text-editor name="content" :value="<div></div>" @input="<div></div> = $event.target.value"></text-editor>

Попробуйте передать статическое значение (без :) в редактор вместо использования v-model:

<text-editor name="content" value="{{ $page->content }}"></text-editor>