var v = new Vue({
el: '#chatApp',
data: {
"msgs":[],
}
}
Vue.component('autolink', {
props: ['content'],
template: '<span>{{ content }}</span>',
mounted: function() {
$(this.$el).autolink();
}
});
<li class="list-group-item msg" v-for="msg in msgs" :data-app="msg.app" :data-fun="msg.fun">
<autolink :content="msg.val"></autolink>
</li>
이 상태에서
v.msgs.shift();
v.msgs.push();
를 사용할 경우, 데이터 갱신 없이, UI가 그려진다. 즉, autolink 에 적힌 내용이 안바뀐다. 그외 부분은 바뀌는데...
<autolink :content="msg.val"></autolink> 가 <span>{{ content }}</span> 으로 바뀌면서 연결에 문제가 생기는 듯
v.msgs.shift();
v.msgs.push();
를 해도 autolink 부분을 빼버리면 정상 동작 한다.