"special alert alerts" without the "ref" or `key` link

Question

I can not play it in the plunker. In this fiddle I have the same setup as I have in my project with these differences: separate filesand webpack- but it works there ...

In one file, I have:

import * as React from 'react';

const Component = function (props) {
    return (
        <div>MyComponent has {props.value} bapples</div>
    )
};


Component.propTypes = {
    value: React.PropTypes.number
};

// export default A;

const HigherOrderComponent = function(props) {
    return (
        <Component {...props} />
    )
};

export default HigherOrderComponent;

Then when I try to connect to redux-storein another file

import HigherOrderComponent from './HigherOrderComponent';

export default ReactRedux.connect()(HigherOrderComponent);

I get a warning about special supports :

Element: refnot a support. Attempting to access it will result in a refund undefined. If you need to get the same value in a child component, you must pass it as another support.

Element: keynot a support. Attempting to access it will result in a refund undefined. If you need to get the same value in a child component, you must pass it as another support.

ref key... googled, .

Answer 1

, (, ):

let props = Object.assign({},this.props)

delete props.key
delete props.ref

return <div> { React.cloneElement(props.children, props) } </div>

, HigherOrderComponent ():

const HigherOrderComponent = function(incomingProps) {
    let props = Object.assign({}, incomingProps)

    delete props.key
    delete props.ref

    return (
        <Component {...props} />
    )
};