jtable组件代码review
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
<!-- TODO 使用标签 应每个参数一行,保持整体写法统一和美观度-->
|
||||||
<a-table :columns="aColumns" :dataSource="dataSource" :pagination="ispagination" :rowSelection="rowSelect" bordered
|
<a-table :columns="aColumns" :dataSource="dataSource" :pagination="ispagination" :rowSelection="rowSelect" bordered
|
||||||
:scroll="{ x: 1920 }">
|
:scroll="{ x: 1920 }">
|
||||||
<!-- <a slot="name" slot-scope="text,scope">{{ scope.age }}</a> -->
|
<!-- <a slot="name" slot-scope="text,scope">{{ scope.age }}</a> -->
|
||||||
@@ -43,6 +44,7 @@
|
|||||||
} from 'ant-design-vue'
|
} from 'ant-design-vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
// TODO 命名和全局保持统一,应为JTable
|
||||||
name: 'Jtable',
|
name: 'Jtable',
|
||||||
props: Object.assign({
|
props: Object.assign({
|
||||||
isShowPage: {
|
isShowPage: {
|
||||||
@@ -90,8 +92,11 @@
|
|||||||
checkedList: [],
|
checkedList: [],
|
||||||
plainOptions: [],
|
plainOptions: [],
|
||||||
|
|
||||||
|
// TODO 未用到的变量请删掉
|
||||||
fixedList: [],
|
fixedList: [],
|
||||||
|
// TODO 初始化了,但未使用的变量请删掉
|
||||||
fixedOptions: [],
|
fixedOptions: [],
|
||||||
|
// TODO 代码中不要出现魔数,使用变量标明3的含义。实在无法处理的地方,最起码给个注释
|
||||||
value: 3,
|
value: 3,
|
||||||
radioStyle: {
|
radioStyle: {
|
||||||
display: 'block',
|
display: 'block',
|
||||||
@@ -118,6 +123,7 @@
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
console.log(this.aColumns)
|
console.log(this.aColumns)
|
||||||
|
// pList含义不清晰,无法理解
|
||||||
let pList = []
|
let pList = []
|
||||||
this.columns.forEach((item) => {
|
this.columns.forEach((item) => {
|
||||||
pList.push(item.dataIndex)
|
pList.push(item.dataIndex)
|
||||||
@@ -129,6 +135,7 @@
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 用户可自行筛选列头显示的字段
|
// 用户可自行筛选列头显示的字段
|
||||||
|
// TODO 该段代码复杂,建议逻辑复杂的代码,在方法名上注释清楚大致逻辑
|
||||||
onChange(e) {
|
onChange(e) {
|
||||||
let newList = [] //最初始list
|
let newList = [] //最初始list
|
||||||
let resList = [] //两个数组不同
|
let resList = [] //两个数组不同
|
||||||
@@ -136,6 +143,7 @@
|
|||||||
newList.push(item.dataIndex)
|
newList.push(item.dataIndex)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// TODO 不要在method里套function,可以考虑另开一个method函数,再进行调用
|
||||||
function getArrDifference(arr1, arr2) {
|
function getArrDifference(arr1, arr2) {
|
||||||
return arr1.concat(arr2).filter(function(v, i, arr) {
|
return arr1.concat(arr2).filter(function(v, i, arr) {
|
||||||
return arr.indexOf(v) === arr.lastIndexOf(v);
|
return arr.indexOf(v) === arr.lastIndexOf(v);
|
||||||
@@ -147,6 +155,7 @@
|
|||||||
this.aColumns = this.columns
|
this.aColumns = this.columns
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
// TODO midColumns这个变量应该声明为局部变量,作为全局变量但没有全局使用是不合理的
|
||||||
for (let i = 0; i < resList.length; i++) {
|
for (let i = 0; i < resList.length; i++) {
|
||||||
this.midColumns = this.midColumns.filter(item =>
|
this.midColumns = this.midColumns.filter(item =>
|
||||||
item.dataIndex !== resList[i]
|
item.dataIndex !== resList[i]
|
||||||
|
|||||||
@@ -149,6 +149,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
// TODO 此处放分页组件的意义?分页组件不是通过参数去操控table组件来进行显隐吗
|
||||||
pagination: {
|
pagination: {
|
||||||
current: 1,
|
current: 1,
|
||||||
pageSize: 5,
|
pageSize: 5,
|
||||||
|
|||||||
Reference in New Issue
Block a user