preact-motion icon indicating copy to clipboard operation
preact-motion copied to clipboard

preact-motion does not work with Preact X due to the change in this.props.children not always being an array

Open CragVFX opened this issue 5 years ago • 0 comments

this.props.children is not guaranteed to be an array and the preact-motion library relies on it being an array.

reference: https://preactjs.com/guide/v10/upgrade-guide/#propschildren-is-not-always-an-array

Error when switching to Preact X:

TypeError: this.props.children[0] is not a function

to fix this, use the toChildArray method from preact in the following functions:

Motion.prototype.render = function render() { var children = preact.toChildArray(this.props.children); return children[0](this.state.currentStyle); };

StaggeredMotion.prototype.render = function render() { var children = preact.toChildArray(this.props.children); return children[0](this.state.currentStyles); };

TransitionMotion.prototype.render = function render() { var hydratedStyles = rehydrateStyles(this.state.mergedPropsStyles, this.unreadPropStyles, this.state.currentStyles); var children = preact.toChildArray(this.props.children); return children[0](hydratedStyles); };

CragVFX avatar Apr 26 '20 20:04 CragVFX