Merge pull request #630 from XiaoMi/hotfix/checkbox&radio&form

Hotfix/checkbox&radio&form

components/checkbox/Group.js

@@ -9,11 +9,11 @@ const prefixCls = 'hi-checkbox-group'
 class Group extends Component {
   constructor (props) {
     super(props)
-    this.state = getData(props)
+    this.state = { data: getData(props), value: props.value }
   }
-  static getDerivedStateFromProps (nextProps) {
-    if (hasValue(nextProps)) {
-      return getData(nextProps)
+  static getDerivedStateFromProps (nextProps, state) {
+    if (nextProps.value !== state.value || getData(nextProps) !== state.data) {
+      return { data: getData(nextProps), value: nextProps.value }
     }
     return null
   }
@@ -63,27 +63,24 @@ class Group extends Component {
 }
 
 function hasValue (props) {
-  const has = (key) => Object.prototype.hasOwnProperty.call(props, key)
-  return has('value')
+  return props.value !== undefined
 }
 
 function getData (props) {
   const { data, value, defaultValue } = props
   const _value = hasValue(props) ? value : defaultValue
-  return {
-    data: data.map((item) => {
-      const isPlain = typeof item === 'string'
-      const label = isPlain ? item : item.content
-      const value = isPlain ? item : item.id
-      const disabled = !isPlain && item.disabled
-      return {
-        label,
-        value,
-        disabled,
-        checked: (_value || []).includes(value)
-      }
-    })
-  }
+  return data.map((item) => {
+    const isPlain = ['string', 'number'].includes(typeof item)
+    const label = isPlain ? item : item.content
+    const value = isPlain ? item : item.id
+    const disabled = !isPlain && item.disabled
+    return {
+      label,
+      value,
+      disabled,
+      checked: (_value || []).includes(value)
+    }
+  })
 }
 
 const PropTypesArrayOfStringOrNumber = PropTypes.oneOfType([

components/form/Item.js

@@ -2,6 +2,7 @@ import React, { Component } from 'react'
 import classNames from 'classnames'
 import AsyncValidator from 'async-validator'
 import PropTypes from 'prop-types'
+import { depreactedPropsCompat } from '../_util'
 
 class FormItem extends Component {
   constructor (props, context) {
@@ -215,4 +216,4 @@ FormItem.defaultProps = {
   size: 'small'
 }
 
-export default FormItem
+export default depreactedPropsCompat([['field', 'prop']])(FormItem)

components/form/index.js

@@ -1,8 +1,7 @@
 import Form from './Form'
 import Item from './Item'
 import './style/index'
-import { depreactedPropsCompat } from '../_util'
 
-Form.Item = depreactedPropsCompat([['field', 'prop']])(Item)
+Form.Item = Item
 
 export default Form

components/radio/Group.js

@@ -10,11 +10,11 @@ const prefixCls = 'hi-radio-group'
 class Group extends React.Component {
   constructor (props) {
     super(props)
-    this.state = getData(props)
+    this.state = { data: getData(props), value: props.value }
   }
-  static getDerivedStateFromProps (nextProps) {
-    if (hasValue(nextProps)) {
-      return getData(nextProps)
+  static getDerivedStateFromProps (nextProps, state) {
+    if (nextProps.value !== state.value || getData(nextProps) !== state.data) {
+      return { data: getData(nextProps), value: nextProps.value }
     }
     return null
   }
@@ -71,27 +71,24 @@ function GroupWrapper ({ children, type, ...restProps }) {
 }
 
 function hasValue (props) {
-  const has = (key) => Object.prototype.hasOwnProperty.call(props, key)
-  return has('value')
+  return props.value !== undefined
 }
 
 function getData (props) {
   const { data, value, defaultValue } = props
   const _value = hasValue(props) ? value : defaultValue
-  return {
-    data: data.map((item) => {
-      const isPlain = typeof item === 'string'
-      const label = isPlain ? item : item.content
-      const value = isPlain ? item : item.id
-      const disabled = !isPlain && item.disabled
-      return {
-        label,
-        value,
-        disabled,
-        checked: _value === value || Number(_value) === value
-      }
-    })
-  }
+  return data.map((item) => {
+    const isPlain = ['string', 'number'].includes(typeof item)
+    const label = isPlain ? item : item.content
+    const value = isPlain ? item : item.id
+    const disabled = !isPlain && item.disabled
+    return {
+      label,
+      value,
+      disabled,
+      checked: _value === value || Number(_value) === value
+    }
+  })
 }
 
 const PropTypesOfStringOrNumber = PropTypes.oneOfType([