layui 穿梭框展示数据操作

上代码 HTML代码 id 为test7 的

         <div class="layui-btn-container">
                <button type="button" class="layui-btn" lay-demotransferactive="getData">获取右侧数据</button>
                <button type="button" class="layui-btn" lay-demotransferactive="reload">重载实例</button>
            </div>

            <div id="test7" class="demo-transfer"></div>

然后 数据 是通过js 请求得到的

        // 左右穿梭 
        layui.use(['transfer', 'layer', 'util'], function () {
            var $ = layui.$,
                transfer = layui.transfer,
                layer = layui.layer,
                util = layui.util;

            //模拟数据
       
            $.ajax({
                url: "/admin.php/goods/chuansuoDetails",
                type: "POST",
                data: {
                    "data": "1"
                },
                dataType: "json",
                success: function (res) {
                 
                    //看清楚 expretList  是要循环的数据  他的值赋值给data 
                    //然后还必须用到parseData 函数进行操作  只需要写上对应的字段即可 他应该                    
                    //给你循环添加上去的 
                    //然后下方的value 是默认情况下右边的值 智力可以用作修改之前的展示
                    var expretList = res.data1
                
                     //实例调用
                    transfer.render({
                        title: ['未选中', '已选中'],
                        elem: '#test7',
                        data: expretList,
                        parseData:function(res){
                            return {
                                "value":res.Id,  //标识符
                                "checked":false,         //是否选中
                                "disabled":false,       //是否被禁止
                                "title":res.Name       //穿梭框的值
                            }
                        },
                        id: 'key123', //定义唯一索引
                        width: 300, //定义宽度
                        height: 1000, //定义高度
                        value: ["1", "3"]           //右侧数据直接初始化
                    })


                }

            });


            //批量办法定事件
            util.event('lay-demoTransferActive', {
                getData: function (othis) {
                    var getData = transfer.getData('key123'); //获取右侧数据
                    layer.alert(JSON.stringify(getData));
                },
                reload: function () {
                    //实例重载
                    transfer.reload('key123', {
                        title: ['文人', '喜欢的文人'],
                        value: ['2', '5', '9'],
                        showSearch: true
                    })
                }
            });
        })

然后 下方是获取右边值的按钮 获取之后在进行逻辑操作