I am getting an error in this code in render() function on the line where I do return where it says unexpected token.Here is the code.
class Game extends React.Component {
constructor(props){
super(props);
this.size=3;
this.board=this.initilaizefun(this.size);
this.state={
rows:this.size,
columns:this.size,
arr:this.board
}
}
shuffle =(array)=>{
}
//now we fill values from o to 8 in board
initilaizefun=(size)=>{
}
rendergrid=()=>{
}
render() {
return (
<div className="game">
<h1>PUZZLE</h1>
</div>
);
}
}
ReactDOM.render(<Game />, document.getElementById('root'));
You renderGrid function contains multiple syntactic errors. Also while writing React code, you need to configure babel with webpack or standalone cdn
rendergrid
function will be like
rendergrid = () => {
let arr1 = Array(this.state.size);
console.log(arr1);
return arr1.map((val, index1) => {
return <div className="board">
{
arr1.map((val, index2) => {
let val2 = this.state.arr[index1][index2].value;
return <button className="button" >{val2}</button>;
})
}
</div>
})
}
If you don't wish to use webpack, you can use cdn like
<div id="root"></div>
<script src="build/react.min.js"></script>
<script src="build/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script>
<script src="app.jsx" type="text/babel"></script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.