feat: forbid inheritAttrs

Author: tangjinzhou

components/auto-complete/index.jsx

@@ -4,7 +4,7 @@ import Select, { AbstractSelectProps, SelectValue } from '../select'
 import Input from '../input'
 import InputElement from './InputElement'
 import PropTypes from '../_util/vue-types'
-import { getComponentFromProp, getOptionProps, filterEmpty } from '../_util/props-util'
+import { getComponentFromProp, getOptionProps, filterEmpty, isValidElement, getEvents, getStyle, getClass } from '../_util/props-util'
 
 const DataSourceItemObject = PropTypes.shape({
   value: String,
@@ -24,7 +24,7 @@ const AutoCompleteProps = {
   ...AbstractSelectProps,
   value: SelectValue,
   defaultValue: SelectValue,
-  dataSource: PropTypes.arrayOf(DataSourceItemType),
+  dataSource: PropTypes.array,
   optionLabelProp: String,
   dropdownMatchSelectWidth: PropTypes.bool,
   // onChange?: (value: SelectValue) => void;
@@ -57,6 +57,13 @@ export default {
       const { $slots } = this
       const children = filterEmpty($slots.default)
       const element = children.length ? children[0] : <Input />
+      console.log(element)
+      const eleProps = {
+        props: getOptionProps(element),
+        on: getEvents(element),
+        style: getStyle(element),
+        class: getClass(element),
+      }
       return (
         <InputElement>{element}</InputElement>
       )
@@ -97,6 +104,9 @@ export default {
       options = childArray
     } else {
       options = dataSource ? dataSource.map((item) => {
+        if (isValidElement(item)) {
+          return item
+        }
         switch (typeof item) {
           case 'string':
             return <Option key={item}>{item}</Option>

components/cascader/index.jsx

@@ -7,7 +7,7 @@ import omit from 'omit.js'
 import KeyCode from '../_util/KeyCode'
 import Input from '../input'
 import Icon from '../icon'
-import { hasProp, filterEmpty, getOptionProps } from '../_util/props-util'
+import { hasProp, filterEmpty, getOptionProps, getStyle, getClass, getAttrs } from '../_util/props-util'
 import BaseMixin from '../_util/BaseMixin'
 
 const CascaderOptionType = PropTypes.shape({
@@ -83,6 +83,7 @@ function defaultSortFilteredOption (a, b, inputValue) {
 const defaultDisplayRender = ({ labels }) => labels.join(' / ')
 
 export default {
+  inheritAttrs: false,
   name: 'ACascader',
   mixins: [BaseMixin],
   props: CascaderProps,
@@ -280,6 +281,7 @@ export default {
       [`${prefixCls}-picker-arrow-expand`]: sPopupVisible,
     })
     const pickerCls = classNames(
+      getClass(this),
       `${prefixCls}-picker`, {
         [`${prefixCls}-picker-with-value`]: inputValue,
         [`${prefixCls}-picker-disabled`]: disabled,
@@ -345,11 +347,13 @@ export default {
         keydown: this.handleKeyDown,
         change: showSearch ? this.handleInputChange : noop,
       },
+      attrs: getAttrs(this),
     }
     const children = filterEmpty($slots.default)
     const input = children.length ? children : (
       <span
         class={pickerCls}
+        style={getStyle(this)}
       >
         { showSearch ? <span class={`${prefixCls}-picker-label`}>
           {this.getLabel()}

components/vc-select/Select.jsx

@@ -6,7 +6,7 @@ import classes from 'component-classes'
 import { Item as MenuItem, ItemGroup as MenuItemGroup } from '../vc-menu'
 import warning from 'warning'
 import Option from './Option'
-import { hasProp, getSlotOptions, getPropsData, getValueByProp as getValue, getComponentFromProp, getEvents, getClass } from '../_util/props-util'
+import { hasProp, getSlotOptions, getPropsData, getValueByProp as getValue, getComponentFromProp, getEvents, getClass, getStyle, getAttrs } from '../_util/props-util'
 import getTransitionProps from '../_util/getTransitionProps'
 import { cloneElement } from '../_util/vnode'
 import BaseMixin from '../_util/BaseMixin'
@@ -45,6 +45,7 @@ function chaining (...fns) {
   }
 }
 export default {
+  inheritAttrs: false,
   name: 'Select',
   mixins: [BaseMixin],
   props: {
@@ -706,9 +707,10 @@ export default {
     },
     _getInputElement () {
       const props = this.$props
+      const attrs = getAttrs(this)
       const inputElement = props.getInputElement
         ? props.getInputElement()
-        : <input id={props.id} autoComplete='off'/>
+        : <input id={attrs.id} autoComplete='off'/>
       const inputCls = classnames(getClass(inputElement), {
         [`${props.prefixCls}-search__field`]: true,
       })
@@ -1501,6 +1503,7 @@ export default {
       selectionProps.attrs.tabIndex = props.disabled ? -1 : 0
     }
     const rootCls = {
+      ...getClass(this),
       [prefixCls]: true,
       [`${prefixCls}-open`]: openStatus,
       [`${prefixCls}-focused`]: openStatus || !!this._focused,
@@ -1542,6 +1545,7 @@ export default {
       >
         <div
           ref='rootRef'
+          style={getStyle(this)}
           class={classnames(rootCls)}
           // tabindex='-1'
           // onBlur={this.onOuterBlur}