diff --git a/src/area/test/__snapshots__/demo.spec.js.snap b/src/area/test/__snapshots__/demo.spec.js.snap index 800cd7ce5..17f03ba59 100644 --- a/src/area/test/__snapshots__/demo.spec.js.snap +++ b/src/area/test/__snapshots__/demo.spec.js.snap @@ -4,7 +4,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -79,7 +79,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -159,8 +159,8 @@ exports[`renders demo correctly 1`] = `
-
-
标题
+
+
标题
@@ -216,8 +216,8 @@ exports[`renders demo correctly 1`] = `
-
-
标题
+
+
标题
diff --git a/src/area/test/__snapshots__/index.spec.js.snap b/src/area/test/__snapshots__/index.spec.js.snap index 1edcbe9d3..b95110eb6 100644 --- a/src/area/test/__snapshots__/index.spec.js.snap +++ b/src/area/test/__snapshots__/index.spec.js.snap @@ -2,7 +2,7 @@ exports[`change option 1`] = `
-
+
@@ -32,7 +32,7 @@ exports[`change option 1`] = ` exports[`change option 2`] = `
-
+
@@ -62,7 +62,7 @@ exports[`change option 2`] = ` exports[`change option 3`] = `
-
+
@@ -92,7 +92,7 @@ exports[`change option 3`] = ` exports[`columns-num prop 1`] = `
-
+
@@ -116,7 +116,7 @@ exports[`columns-num prop 1`] = ` exports[`reset method 1`] = `
-
+
@@ -145,7 +145,7 @@ exports[`reset method 1`] = ` exports[`reset method 2`] = `
-
+
@@ -175,7 +175,7 @@ exports[`reset method 2`] = ` exports[`watch areaList & code 1`] = `
-
+
@@ -205,7 +205,7 @@ exports[`watch areaList & code 1`] = ` exports[`watch areaList & code 2`] = `
-
+
@@ -235,7 +235,7 @@ exports[`watch areaList & code 2`] = ` exports[`watch areaList & code 3`] = `
-
+
diff --git a/src/datetime-picker/test/__snapshots__/date-picker.spec.js.snap b/src/datetime-picker/test/__snapshots__/date-picker.spec.js.snap index 1c224ee23..021a425f5 100644 --- a/src/datetime-picker/test/__snapshots__/date-picker.spec.js.snap +++ b/src/datetime-picker/test/__snapshots__/date-picker.spec.js.snap @@ -2,7 +2,7 @@ exports[`filter prop 1`] = `
-
+
@@ -61,7 +61,7 @@ exports[`filter prop 1`] = ` exports[`formatter prop 1`] = `
-
+
diff --git a/src/datetime-picker/test/__snapshots__/datetime-picker.spec.js.snap b/src/datetime-picker/test/__snapshots__/datetime-picker.spec.js.snap index 7a0e7e0d6..72bd141c5 100644 --- a/src/datetime-picker/test/__snapshots__/datetime-picker.spec.js.snap +++ b/src/datetime-picker/test/__snapshots__/datetime-picker.spec.js.snap @@ -2,7 +2,7 @@ exports[`time type 1`] = `
-
+
diff --git a/src/datetime-picker/test/__snapshots__/demo.spec.js.snap b/src/datetime-picker/test/__snapshots__/demo.spec.js.snap index c622030fa..859d83682 100644 --- a/src/datetime-picker/test/__snapshots__/demo.spec.js.snap +++ b/src/datetime-picker/test/__snapshots__/demo.spec.js.snap @@ -4,7 +4,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -164,7 +164,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -242,7 +242,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -285,7 +285,7 @@ exports[`renders demo correctly 1`] = `
-
+
@@ -375,7 +375,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/src/datetime-picker/test/__snapshots__/time-picker.spec.js.snap b/src/datetime-picker/test/__snapshots__/time-picker.spec.js.snap index 2a5e847cb..6d7e9887f 100644 --- a/src/datetime-picker/test/__snapshots__/time-picker.spec.js.snap +++ b/src/datetime-picker/test/__snapshots__/time-picker.spec.js.snap @@ -2,7 +2,7 @@ exports[`filter prop 1`] = `
-
+
@@ -33,7 +33,7 @@ exports[`filter prop 1`] = ` exports[`format initial value 1`] = `
-
+
@@ -57,7 +57,7 @@ exports[`format initial value 1`] = ` exports[`formatter prop 1`] = `
-
+
@@ -88,7 +88,7 @@ exports[`formatter prop 1`] = ` exports[`max-hour & max-minute 1`] = `
-
+
diff --git a/src/picker/index.js b/src/picker/index.js index 02bf60e97..b04d7fc7d 100644 --- a/src/picker/index.js +++ b/src/picker/index.js @@ -63,7 +63,12 @@ export default createComponent({ onChange(columnIndex) { if (this.simple) { - this.$emit('change', this, this.getColumnValue(0), this.getColumnIndex(0)); + this.$emit( + 'change', + this, + this.getColumnValue(0), + this.getColumnIndex(0) + ); } else { this.$emit('change', this, this.getValues(), columnIndex); } @@ -105,7 +110,10 @@ export default createComponent({ // set options of column by index setColumnValues(index, options) { const column = this.children[index]; - if (column && JSON.stringify(column.options) !== JSON.stringify(options)) { + if ( + column && + JSON.stringify(column.options) !== JSON.stringify(options) + ) { column.options = options; column.setIndex(0); } @@ -142,13 +150,70 @@ export default createComponent({ onCancel() { this.emit('cancel'); + }, + + genTitle() { + const titleSlot = this.slots('title'); + + if (titleSlot) { + return titleSlot; + } + + if (this.title) { + return
{this.title}
; + } + }, + + genToolbar() { + if (this.showToolbar) { + return ( +
+ {this.slots() || [ + , + this.genTitle(), + + ]} +
+ ); + } + }, + + genColumns() { + const columns = this.simple ? [this.columns] : this.columns; + + return columns.map((item, index) => ( + { + this.onChange(index); + }} + /> + )); } }, render(h) { const { itemHeight } = this; const wrapHeight = itemHeight * this.visibleItemCount; - const columns = this.simple ? [this.columns] : this.columns; const frameStyle = { height: `${itemHeight}px` @@ -162,49 +227,25 @@ export default createComponent({ backgroundSize: `100% ${(wrapHeight - itemHeight) / 2}px` }; - const Toolbar = this.showToolbar && ( -
- {this.slots() || [ - , - this.slots('title') || - (this.title && ( -
{this.title}
- )), - - ]} -
- ); - return (
- {this.toolbarPosition === 'top' ? Toolbar : h()} + {this.toolbarPosition === 'top' ? this.genToolbar() : h()} {this.loading ? : h()} {this.slots('columns-top')} -
- {columns.map((item, index) => ( - { - this.onChange(index); - }} - /> - ))} +
+ {this.genColumns()}
-
+
{this.slots('columns-bottom')} - {this.toolbarPosition === 'bottom' ? Toolbar : h()} + {this.toolbarPosition === 'bottom' ? this.genToolbar() : h()}
); } diff --git a/src/picker/test/__snapshots__/demo.spec.js.snap b/src/picker/test/__snapshots__/demo.spec.js.snap index 5d427bec3..1464ed379 100644 --- a/src/picker/test/__snapshots__/demo.spec.js.snap +++ b/src/picker/test/__snapshots__/demo.spec.js.snap @@ -42,8 +42,8 @@ exports[`renders demo correctly 1`] = `
-
-
标题
+
+
标题
diff --git a/src/picker/test/__snapshots__/index.spec.js.snap b/src/picker/test/__snapshots__/index.spec.js.snap index a1d427794..090e416a7 100644 --- a/src/picker/test/__snapshots__/index.spec.js.snap +++ b/src/picker/test/__snapshots__/index.spec.js.snap @@ -30,7 +30,7 @@ exports[`column watch default index 2`] = ` exports[`columns-top、columns-bottom prop 1`] = `
-
+
Custom Columns Top
@@ -57,7 +57,7 @@ exports[`not allow html 1`] = ` exports[`render title slot 1`] = `
-
Custom title
+
Custom title
@@ -75,6 +75,6 @@ exports[`toolbar-position prop 1`] = `
-
+
`;