vue表格复制

最新推荐文章于 2024-06-27 10:51:27 发布

等风也在等着你

最新推荐文章于 2024-06-27 10:51:27 发布

阅读量1.7k

点赞数

分类专栏： element-ui vue 文章标签： vue element

本文链接：https://blog.csdn.net/weixin_44860425/article/details/99290937

版权

vue 同时被 2 个专栏收录

38 篇文章 0 订阅

订阅专栏

element-ui

22 篇文章 0 订阅

订阅专栏

列表1选中后的数据复制给表格2

tableData110表格1的数据，选中后复制到dataList表格2上面

<!--表格1-->
                    <div v-if='flag == 1'>
                        <el-table
                        :data="tableData110"
                        @selection-change="changeFun"
                        height="365"
                        border
                        style="width: 100%">
                            <el-table-column show-overflow-tooltip type="selection" width="55"></el-table-column>  
                            <el-table-column show-overflow-tooltip prop="importNum" label="导入批次号" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="partnerCompanyName" label="公司全称/姓名" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="companyTypeText" label="合作商类型" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="unionCode" label="信用代码/身份证" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="serviceTypeName" label="服务类型" width="180"></el-table-column>                       
                        </el-table>
                        <!--列表1分页-->
                        <div class="block">
                        <el-pagination
                                align='center'
                                @size-change="handleSizeChange110"
                                @current-change="handleCurrentChange110"
                                :current-page="currentPage110"
                                :page-sizes="[10,50,100,500]"
                                :page-size="pageSize110"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total110">
                        </el-pagination>
                        </div>
                    </div>

<!--将表格1选中的数据复制给列表2-->
                    <div>
                        <el-table
                        :data="dataList"
                        height="365"
                        border
                        style="width: 100%">
                            <el-table-column show-overflow-tooltip type="selection" width="55" v-if="false" ></el-table-column> 
                            <el-table-column show-overflow-tooltip prop="importNum" label="导入批次号" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="partnerCompanyName" label="公司全称/姓名" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="companyTypeText" label="合作商类型" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="unionCode" label="信用代码/身份证" width="180"></el-table-column>
                            <el-table-column show-overflow-tooltip prop="serviceTypeName" label="服务类型" width="180"></el-table-column>                        
                        </el-table>
                        <!--分页2-->
                        <div class="block">
                        <el-pagination
                                align='center'
                                @size-change="handleSizeChange110"
                                @current-change="handleCurrentChange110"
                                :current-page="currentPage"
                                :page-sizes="[10,50,100,500]"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="dataList.length">
                        </el-pagination>
                        </div>
                    </div>

			//获取选中结果
            getSelected() {
                return this.multipleSelection;
            },
            //点击选中的数据添加到第三步
            interiorList(){
                // 获取选中的数据
                var dataList = this.getSelected();
                if (!dataList || dataList.length == 0) {
                    alert("请先勾选数据!");
                    return false;
                }
                this.dataList = dataList        
            },
            changeFun (val) {
                this.multipleSelection = val // 返回的是选中的列的数组集合
            },