react-svg-morph
react-svg-morph copied to clipboard
It's not working for me. Thrown error: Expected a class but got undefined
I did tried 2 ways:
CancelSvg.js
import React from 'react'
import Svg, { Line } from 'react-native-svg'
export default class CancelSvg extends React.Component {
render () {
return (
<Svg height='50' width='50'>
<Line x1={37.5} x2={12.5} y1={12.5} y2={37.5} strokeWidth='2.5' stroke={'#fff'} />
<Line x1={12.5} x2={37.5} y1={12.5} y2={37.5} strokeWidth='2.5' stroke={'#fff'} />
</Svg>
)
}
}
MenuSvg.js
import React from 'react'
import Svg, { Line } from 'react-native-svg'
export default class MenuSvg extends React.Component {
render () {
return (
<Svg height='50' width='50'>
<Line x1={10} x2={40} y1={15} y2={15} strokeWidth='2.5' stroke={'#fff'} />
<Line x1={10} x2={40} y1={25} y2={25} strokeWidth='2.5' stroke={'#fff'} />
<Line x1={10} x2={40} y1={35} y2={35} strokeWidth='2.5' stroke={'#fff'} />
</Svg>
)
}
}
Main.js
<MorphReplaceNative width={60} height={60}>
{
this.state.showMenu ? <MenuSvg /> : <CancelSvg />
}
</MorphReplaceNative>
Error: Expected a class but got undefined. You likely forgot to export your Component from the file it's defined.
But I did export it. I also tried replacing <Svg> with
Did you imported MenuSvg and CancelSvg in your Main.js?