1、 定義兩個數組，分別是左側數據和右側數據
2、 右側的數據追加左側選中的狀態
3、 把左側的數據進行過濾的處理（filter）對當前數組過濾處理，返回的是滿足條件的數組

var selectData = this.leftData.filter(function(item){return item.check=true });

4、 未封裝的寫法
(1)es5 合并數組
this.rightData = this.rightData.concat(selectData);
(2)es6 擴展運算符 … (序列化) a1 = [1,2] a2=[3,4] a3=[…a1,…a2]
this.rightData = […this.rightData,…selectData];
(3) this.rightData.push(…selectData);
5、 把左邊的數組只剩下false的

this. leftData = this.leftData.filter(function(item){return item.check=false });

6、 //封裝公共方法
toRight:function(){
var selectData = this.filterData(this.leftData,true);
this.rightData.push(…selectData);
this.leftData = this.filterData(this.leftData,false)
};
filterData:function(data,type){
return data.filter(function(item){
r

總結

以上是生活随笔為你收集整理的vue版本穿梭框的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。