Vue変異メソッドspliceコメント削除機能
4548 ワード
{{title}}
- for="(v,k) in list">
{{v.content}}
<span style="color: #0000ff;">var</span> vue = <span style="color: #0000ff;">function</span> (options){<span style="color: #0000ff;">new</span><span style="color: #000000;"> Vue(options)};
vue({
el:</span>'#title'<span style="color: #000000;">,
data:{
title:</span>'Vue splice '<span style="color: #000000;">
}
});
</span><span style="color: #0000ff;">var</span> app =<span style="color: #000000;"> vue({
el:</span>'#ask'<span style="color: #000000;">,
data:{
content:</span>''<span style="color: #000000;">,
list:[
{</span>'content':'ask.mykeji.net'<span style="color: #000000;">},
{</span>'content':' '<span style="color: #000000;">}
]
},
methods:{
remove(k){
</span><span style="color: #0000ff;">this</span>.list.splice(k,1<span style="color: #000000;">)
},
push(type){
</span><span style="color: #0000ff;">var</span> content_push = {'content':<span style="color: #0000ff;">this</span><span style="color: #000000;">.content};
</span><span style="color: #0000ff;">switch</span><span style="color: #000000;"> (type) {
</span><span style="color: #0000ff;">case</span> 'pre'<span style="color: #000000;">:
</span><span style="color: #0000ff;">this</span><span style="color: #000000;">.list.unshift(content_push);
</span><span style="color: #0000ff;">break</span><span style="color: #000000;">;
</span><span style="color: #0000ff;">case</span> "end"<span style="color: #000000;">:
</span><span style="color: #0000ff;">this</span><span style="color: #000000;">.list.push(content_push);
</span><span style="color: #0000ff;">break</span><span style="color: #000000;">;
}
</span><span style="color: #0000ff;">this</span>.content=''<span style="color: #000000;">;
},
del(type){
</span><span style="color: #0000ff;">switch</span><span style="color: #000000;"> (type) {
</span><span style="color: #0000ff;">case</span> 'first'<span style="color: #000000;">:
</span><span style="color: #0000ff;">this</span><span style="color: #000000;">.list.shift();
</span><span style="color: #0000ff;">break</span><span style="color: #000000;">;
</span><span style="color: #0000ff;">case</span> "last"<span style="color: #000000;">:
</span><span style="color: #0000ff;">this</span><span style="color: #000000;">.list.pop();
</span><span style="color: #0000ff;">break</span><span style="color: #000000;">;
}
}
}
});
</span>