score:3
my solution would be this, referring to the react documentation regarding type checking and creating defaultprops as a static function, to get them at everytime.
class markdown extends react.component {
static defaultprops() {
return {
text : 'this comes from defaultprops !'
};
}
constructor(props) {
super(props);
this.handlechange = this.handlechange.bind(this);
}
handlechange(e) {
this.props.onchange(e.target.value);
}
render() {
const style = {
width : '100%',
fontsize : '18px',
border : '1px solid grey',
padding : '20px'
};
return (
<textarea style={style} rows='20' placeholder='// enter text here ..' onchange='this.handlechange'>
{this.props.text}
</textarea>
);
}
}
markdown.proptypes = {
text : react.proptypes.string.isrequired,
onchange : react.proptypes.func.isrequired
};
score:0
don't have any experience with react, but it does seem to me you need some sort of string quoting in your 'return' function. that for javascript would certainly throw the error you're seeing.
score:1
in jsx, you need to use double quotes for passing props to elements.
you're using single quotes, which won't work and causes the error.
another mistake is enclosing your change handler in single quotes, in this case, you have to use curly braces, because it is actually a javascript argument you want react to execute, not a string.
return (
<textarea style={style} rows="20" placeholder="// enter text here .." onchange={this.handlechange}>
{this.props.text}
</textarea>
);
Source: stackoverflow.com
Related Query
- Unexpected Identifier while coding in React
- SyntaxError: Unexpected identifier while deploying React application on Docker container
- Unexpected end of JSON on GraphQL query with React while no issue with GraphiQL
- SyntaxError: Unexpected identifier importing React (Javascript)
- Getting a " Parsing error: Unexpected token, expected ";" " while making a react application in the following code
- react import environment in setupProxy.js of http-proxy-middleware generate unexpected identifier
- SyntaxError: Unexpected identifier {import React from 'react';
- Webpack@4.41 with babel-loader@8 error while building react scripts (Module parse failed: Unexpected token)
- react parsing error: unexpected error '#' while using the react router sitemap npm
- While compiling my react app I am getting Module build failed: SyntaxError: Unexpected token
- Parse Error: Line 9: Unexpected identifier in react
- VSCode debugging (F5) react app gives SyntaxError: Unexpected identifier
- Syntax error: Unexpected token in react while importing an component using React.lazy() method
- SyntaxError: Unexpected identifier import bodyParser from 'body-parser'; … In REACT JS app
- import React from "react"; resulting in Uncaught SyntaxError: Unexpected identifier
- Unexpected token Error while implementing fixed data table in react
- Getting unexpected token, expected "," while trying to map an array in React
- SyntaxError: Import React from 'react' Unexpected identifier
- Unexpected state behaviour while dynamically rendering elements in React typescript
- "npm ERR! unexpected end of JSON input near" while creating a new react app
- JSON Parse error: Unexpected identifier "Not" while fetching when I add JWT auth header
- React - Display loading screen while DOM is rendering?
- How to show a loading indicator in React Redux app while fetching the data?
- Extending HTML elements in React and TypeScript while preserving props
- React Js: Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
- Github - unexpected disconnect while reading sideband packet
- Error while creating new React app ("You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0)")
- React with Typescript -- Generics while using React.forwardRef
- Unexpected token < error in react router component
- A React component suspended while rendering, but no fallback UI was specified
More Query from same tag
- Flow: What is the equivalent of PropTypes.func in flow?
- How to enable CORS policy in AWS between API Gateway and React app?
- React Hooks setState in useEffect once on ref mount
- How to pass multiple arguments through React Context (from Consumer to Provider)?
- Why the auto binded props yields a warning message at run-time by propTypes?
- How to give prop only to first result of map in react?
- scss wrong selector being matched
- ¿How do I align the checkboxs like the design?
- Mobx does not rerender after an item in observable array has changed
- Override the transition delay in React Framer Motion
- React-Table: not assignable to type Partial<TableState<object>>
- How to create different styles for different React Tables?
- Property 'display' does not exist on type 'HTMLIonListElement'
- Make the loop run after "return" statement. [React JS]
- What's the use of this statement: { router: routerReducer }
- Intersection Observer with React JS
- SetTimeout Behaving weirdly in ReactJS
- react - get width/height of image to process
- Remove readOnly on input when button is clicked on React
- How can i use the same class with differents mapDispatchToProps - Best practice
- React.js How can I convert string base64 to normal image
- How to test a component base on material ui?
- how to convert a base64 string in to normal image and show it in a web page in react js
- Parent state not updating child component
- React Router v4: Component and Children in the same route
- How to disable delete option for particular value in ChipInput(material-ui-chip-input)?
- to create and send React RefObject as prop
- React Recompose Initial state value form Async Source
- How to use React.lazy in Gatsby
- React.js make a phone call with a tag is not working