SyntaxError:Unexpected token, expected ","
SyntaxError:Unexpected token, expected ","
Error it self
How it looks in VScode
这就是 Toollsit 组件
import React, { Component } from 'react';
import Toolitem from './Toolitem'
import App from '../App';
const styles = {
ul:{
listStyle:"none",
width:"300px"
}
}
export default function Toollsit(toto,title){
return(
{toto.map((toto)=>{return (<Toolitem toto={toto} />)})}
);
};
这就是 Toolitem 组件
从 'react';
导入 React
const Toolitem = ({toto}) => {
return (
<div>
<li>
{toto.title}
</li>
</div>
);
};
export default Toolitem;
这就是我的 App.js
import react from 'react';
import Toollsit from './components/Toollsit'
function App(props) {
const toto =[
{id:1,title:'First',completed:true},
{id:2,title:'Second',completed:false},
{id:3,title:'Third',completed:true},
];
return (
<span className="wrapper">
<Toollsit toto={toto} />
</span>
);
}
export default App;
感谢您的任何帮助,评论家我非常感谢您的反馈
您必须将 map
函数放在 <React.Fragment>
标记中(等效于:<>
)。此外,参数应该是被破坏的对象。
export default function Toollsit({toto, title}){
return(<>
{toto.map((toto)=>{return (<Toolitem toto={toto} />)})}
</>);
};
Error it self
How it looks in VScode
这就是 Toollsit 组件
import React, { Component } from 'react';
import Toolitem from './Toolitem'
import App from '../App';
const styles = {
ul:{
listStyle:"none",
width:"300px"
}
}
export default function Toollsit(toto,title){
return(
{toto.map((toto)=>{return (<Toolitem toto={toto} />)})}
);
};
这就是 Toolitem 组件 从 'react';
导入 React const Toolitem = ({toto}) => {
return (
<div>
<li>
{toto.title}
</li>
</div>
);
};
export default Toolitem;
这就是我的 App.js
import react from 'react';
import Toollsit from './components/Toollsit'
function App(props) {
const toto =[
{id:1,title:'First',completed:true},
{id:2,title:'Second',completed:false},
{id:3,title:'Third',completed:true},
];
return (
<span className="wrapper">
<Toollsit toto={toto} />
</span>
);
}
export default App;
感谢您的任何帮助,评论家我非常感谢您的反馈
您必须将 map
函数放在 <React.Fragment>
标记中(等效于:<>
)。此外,参数应该是被破坏的对象。
export default function Toollsit({toto, title}){
return(<>
{toto.map((toto)=>{return (<Toolitem toto={toto} />)})}
</>);
};