diff --git a/packages/address-edit/test/__snapshots__/demo.spec.js.snap b/packages/address-edit/test/__snapshots__/demo.spec.js.snap index 98bdff5e2..6aa6f3686 100644 --- a/packages/address-edit/test/__snapshots__/demo.spec.js.snap +++ b/packages/address-edit/test/__snapshots__/demo.spec.js.snap @@ -4,19 +4,19 @@ exports[`renders demo correctly 1`] = `
-
+
姓名
-
+
电话
-
+
地区
@@ -24,7 +24,7 @@ exports[`renders demo correctly 1`] = `
-
+
详细地址
@@ -32,7 +32,7 @@ exports[`renders demo correctly 1`] = `
-
+
邮政编码
diff --git a/packages/address-edit/test/__snapshots__/index.spec.js.snap b/packages/address-edit/test/__snapshots__/index.spec.js.snap index c27df2566..d102b4c3f 100644 --- a/packages/address-edit/test/__snapshots__/index.spec.js.snap +++ b/packages/address-edit/test/__snapshots__/index.spec.js.snap @@ -2,19 +2,19 @@ exports[`create a AddressEdit 1`] = `
-
+
姓名
-
+
电话
-
+
地区
@@ -22,7 +22,7 @@ exports[`create a AddressEdit 1`] = `
-
+
详细地址
@@ -59,19 +59,19 @@ exports[`create a AddressEdit 1`] = ` exports[`create a AddressEdit with props 1`] = `
-
+
姓名
-
+
电话
-
+
地区
@@ -79,7 +79,7 @@ exports[`create a AddressEdit with props 1`] = `
-
+
详细地址
@@ -87,7 +87,7 @@ exports[`create a AddressEdit with props 1`] = `
-
+
邮政编码
diff --git a/packages/cell/index.js b/packages/cell/index.js index 84a1fba5f..cc64b09f3 100644 --- a/packages/cell/index.js +++ b/packages/cell/index.js @@ -1,69 +1,83 @@ import { use, isDef } from '../utils'; +import { cellProps } from './shared'; +import { emit, inherit, unifySlots } from '../utils/functional'; +import { routeProps, functionalRoute } from '../mixins/router-link'; import Icon from '../icon'; -import CellMixin from '../mixins/cell'; -import RouterLink from '../mixins/router-link'; const [sfc, bem] = use('cell'); export default sfc({ - mixins: [CellMixin, RouterLink], + functional: true, props: { + ...cellProps, + ...routeProps, size: String, clickable: Boolean, arrowDirection: String }, - methods: { - onClick() { - this.$emit('click'); - this.routerLink(); - } - }, + render(h, context) { + const slots = unifySlots(context); + const { props } = context; + const { icon, size, title, label, value, isLink, arrowDirection } = props; - render(h) { - const { slots } = this; - const showTitle = slots('title') || isDef(this.title); - const showValue = slots() || isDef(this.value); + const showTitle = slots.title || isDef(title); + const showValue = slots.default || isDef(value); const Title = showTitle && ( -
- {slots('title') || {this.title}} - {this.label &&
{this.label}
} +
+ {slots.title ? slots.title() : {title}} + {label &&
{label}
}
); const Value = showValue && ( -
- {slots() || {this.value}} +
+ {slots.default ? slots.default() : {value}}
); - const LeftIcon = slots('icon') || ( - this.icon && - ); + const LeftIcon = slots.icon + ? slots.icon() + : icon && ; - const arrowIcon = this.arrowDirection ? `arrow-${this.arrowDirection}` : 'arrow'; - const RightIcon = slots('right-icon') || ( - this.isLink && - ); + const RightIcon = slots['right-icon'] + ? slots['right-icon']() + : isLink && ( + + ); + + const onClick = event => { + emit(context, 'click', event); + functionalRoute(context); + }; return (
{LeftIcon} {Title} {Value} {RightIcon} - {slots('extra')} + {slots.extra && slots.extra()}
); } diff --git a/packages/cell/shared.ts b/packages/cell/shared.ts new file mode 100644 index 000000000..bf2010717 --- /dev/null +++ b/packages/cell/shared.ts @@ -0,0 +1,16 @@ +export const cellProps = { + icon: String, + center: Boolean, + isLink: Boolean, + required: Boolean, + titleClass: String, + valueClass: String, + labelClass: String, + title: [String, Number], + value: [String, Number], + label: [String, Number], + border: { + type: Boolean, + default: true + } +}; diff --git a/packages/cell/test/index.spec.js b/packages/cell/test/index.spec.js index 73dd6cfee..94f1ca5a4 100644 --- a/packages/cell/test/index.spec.js +++ b/packages/cell/test/index.spec.js @@ -2,8 +2,15 @@ import Cell from '..'; import { mount } from '../../../test/utils'; test('click event', () => { - const wrapper = mount(Cell); + const click = jest.fn(); + const wrapper = mount(Cell, { + context: { + on: { + click + } + } + }); wrapper.trigger('click'); - expect(wrapper.emitted('click')).toBeTruthy(); + expect(click.mock.calls.length).toBeTruthy(); }); diff --git a/packages/collapse-item/index.js b/packages/collapse-item/index.js index fc7a00d83..208e828df 100644 --- a/packages/collapse-item/index.js +++ b/packages/collapse-item/index.js @@ -1,16 +1,17 @@ import { use, isDef } from '../utils'; import { raf } from '../utils/raf'; import Cell from '../cell'; -import CellMixin from '../mixins/cell'; +import { cellProps } from '../cell/shared'; import FindParent from '../mixins/find-parent'; const [sfc, bem] = use('collapse-item'); const CELL_SLOTS = ['title', 'icon', 'right-icon']; export default sfc({ - mixins: [CellMixin, FindParent], + mixins: [FindParent], props: { + ...cellProps, name: [String, Number], disabled: Boolean, isLink: { diff --git a/packages/contact-card/test/__snapshots__/demo.spec.js.snap b/packages/contact-card/test/__snapshots__/demo.spec.js.snap index 9e49b3f1f..e81100f26 100644 --- a/packages/contact-card/test/__snapshots__/demo.spec.js.snap +++ b/packages/contact-card/test/__snapshots__/demo.spec.js.snap @@ -25,13 +25,13 @@ exports[`renders demo correctly 1`] = `