babel-plugin-transform-decorators-legacy
babel-plugin-transform-decorators-legacy copied to clipboard
Decorator not applied on same react child components
var count = 0;
@connect(state => ({
products: state.products
}))
export default class ParameterNode extends React.Component {
constructor(props, context) {
super(props, context);
console.log('props', props);
}
render() {
count = count + 1;
if(count < 5) {
return <ParameterNode />;
}
else {
return <div></div>;
}
}
}
And the console output:
props Object {products: Object}
props Object {}
props Object {}
props Object {}
props Object {}
On the babel 5 it's ok.
Would you be able to trim down a reproducible version with a simple decorator? I don't know how connect
works. If not I can give it a shot eventually.
@loganfsmyth hmm, it seems that there is problem with react-redux connect decorator cause with simple decorator all works fine. Sorry for disturbing.
I was wrong.
function wrap(wrappedComponent) {
class Wrapper extends React.Component {
render() {
return React.createElement(wrappedComponent, this.props);
}
}
return Wrapper;
};
@wrap
export class Node extends React.Component {
render() {
const nodes = [
<Node alone />,
<Node alone />,
<Node alone />
];
if(this.props.alone) {
return <div>Node</div>;
}
else {
return <div>{nodes}</div>;
}
}
}
As result: one wrapper, many nodes.
Expected: each node wrapped by wrapper (babel-5 behavior)
Perfect, thanks for the great example. I've got a busy week, but I'll try to get to this when I can.
I'm a little on the fence on this, now that I look into it more. It seems like an edge-case where Babel 5's behavior differers from my reading of the spec. The https://github.com/wycats/javascript-decorators#desugaring-es6 ES6 class desugaring example from the decorator repo is the logic that I follow in this implementation. My reading of that would imply that usage of Note
within the Note
class body, would still refer to the original class constructor, not the one returned from the decorator function.
At the moment, I'm tempted to lean toward adding this as a third entry in the "Best Effort" list in the README.
Any updates?