react-svg-morph icon indicating copy to clipboard operation
react-svg-morph copied to clipboard

It's not working for me. Thrown error: Expected a class but got undefined

Open VanessaChu opened this issue 6 years ago • 1 comments

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 in MenuSvg.js and CancelSvg.js but it's not working.

VanessaChu avatar Apr 15 '18 01:04 VanessaChu

Did you imported MenuSvg and CancelSvg in your Main.js?

isaaclem avatar Apr 21 '18 12:04 isaaclem