[Improvement] Cell: support number type title & value (#1073)

packages/cell/en-US.md

@@ -71,8 +71,8 @@ Vue.use(Cell).use(CellGroup);
 | Attribute | Description | Type | Default |
 |-----------|-----------|-----------|-------------|
 | icon | Left Icon | `String` | - |
-| title | Title | `String` | - |
-| value | Right text | `String` | - |
+| title | Title | `String | Number` | - |
+| value | Right text | `String | Number` | - |
 | label | Description below the title | `String` | - |
 | border | Whether to show inner border | `Boolean` | `true` |
 | center | Whether to center content vertically | `Boolean` | `true` |

packages/cell/index.vue

@@ -13,14 +13,14 @@
     <slot name="icon">
       <icon v-if="icon" :class="b('left-icon')" :name="icon" />
     </slot>
-    <div v-if="title || $slots.title" :class="b('title')">
+    <div v-if="isDef(title) || $slots.title" :class="b('title')">
       <slot name="title">
         <span v-text="title" />
         <div v-if="label" v-text="label" :class="b('label')" />
       </slot>
     </div>
     <div
-      v-if="value || $slots.default"
+      v-if="isDef(value) || $slots.default"
       :class="b('value', { alone: !$slots.title && !title })"
     >
       <slot>
@@ -36,6 +36,7 @@
 
 <script>
 import Icon from '../icon';
+import { isDef } from '../utils';
 import RouterLink from '../mixins/router-link';
 import create from '../utils/create-basic';
 
@@ -50,12 +51,12 @@ export default create({
 
   props: {
     icon: String,
-    title: String,
     label: String,
     center: Boolean,
     isLink: Boolean,
     required: Boolean,
     clickable: Boolean,
+    title: [String, Number],
     value: [String, Number],
     border: {
       type: Boolean,
@@ -64,6 +65,8 @@ export default create({
   },
 
   methods: {
+    isDef,
+
     onClick() {
       this.$emit('click');
       this.routerLink();

packages/cell/test/index.spec.js

@@ -0,0 +1,9 @@
+import Cell from '..';
+import { mount } from '@vue/test-utils';
+
+test('click event', () => {
+  const wrapper = mount(Cell);
+
+  wrapper.trigger('click');
+  expect(wrapper.emitted('click')).toBeTruthy();
+});

packages/cell/zh-CN.md

@@ -78,8 +78,8 @@ Vue.use(Cell).use(CellGroup);
 | 参数 | 说明 | 类型 | 默认值 |
 |-----------|-----------|-----------|-------------|
 | icon | 左侧图标，可选值见 Icon 组件 | `String` | - |
-| title | 左侧标题 | `String` | - |
-| value | 右侧内容 | `String` | - |
+| title | 左侧标题 | `String | Number` | - |
+| value | 右侧内容 | `String | Number` | - |
 | label | 标题下方的描述信息 | `String` | - |
 | border | 是否显示内边框 | `Boolean` | `true` |
 | center | 是否使内容垂直居中 | `Boolean` | `false` |