Ad
Add Material Icon In React-Toastify Message
This is the code defined in one folder. I am tring to add the material Icon in this. But it is showing the error
React' must be in scope when using JSX
import { toast } from 'react-toastify';
import ErrorIcon from '@material-ui/icons/Error';
const Alert = (type, message) => {
switch (type) {
case 'warning':
return toast.warning(message)
case 'error':
return toast.error(<div><ErrorIcon/> {message}</div>) // look this line
case 'success':
return toast.success(message)
case 'info':
return toast.info(message)
case 'dark':
return toast.dark(message)
default:
return toast(message)
}
}
export default Alert;
Accessing the code like this...
import Alert from '../utils/toster.js';
Alert('error', 'Try Again')
Ad
Answer
Please import react on top of your file that used JSX.
import React from 'react'
Ad
source: stackoverflow.com
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
Ad