LINUX.ORG.RU
Форум — Web-development  

vue затирает h1

 


0

1 
<div id="app">
<h1 v-html="header">страница</h1>
</div>
var app = new Vue({
  el: '#app',
  data: {
      header: null
  }
});



После загрузки страницы h1 затирается. Как установить начальное значение header, чтобы vue брал за основу уже имеющийся текст внутри h1?

★★★★
← JS фреймворк для ajax api, подгрузки блоков
Помогите придумать вопросы для собеседования для миддла фронтенда →
Ответ на: комментарий от gobot

Может быть и можно, я пока не очень понимаю, чего ты хочешь добиться в итоге, и какого поведения ожидаешь.

hippi90 ★★★★★
()
Ответ на: комментарий от hippi90

Вот что мне нужно было, по сути немного изменить логику v-html

<div id="app">
<h1 v-myhtml="header">Page</h1>
</div>
Vue.directive('myhtml', {
    bind: function (el, binding, vnode, oldVnode) {
        if(binding.value) {
            el.innerHTML = binding.value;
        }
    },

    update: function(el, binding, vnode, oldVnode){
        el.innerHTML = binding.value;
    }
});

app = new Vue({
   el: '#app',
   data: { 
      header: ""
   }
})


setTimeout(function(){
   app.header = "new header";
}, 1000)


Если header не имеет первоначального значения, то подставляется просто innerHTML элемента, а при обновлении устанавливается переменная header. Почему такой элементарщины нет в дефолтном Vue большая загадка, год наверное голову ломал!

Кстати как переопределить глобальный v-html?

gobot ★★★★
() автор топика
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.
← JS фреймворк для ajax api, подгрузки блоков
Web-development
Помогите придумать вопросы для собеседования для миддла фронтенда →