参数错误,必须为反应元素,但您传递了未定义的参数
2020-08-09
12011
我开始在 react 和material ui 中开发一个新应用程序,遇到了一个问题:
Error: React.cloneElement(...): The argument must be a React element, but you passed undefined.
因此我还没有编写任何逻辑代码,我刚刚开始使用 react 和material ui。这个问题的解决方案和指导将非常有帮助。
这是代码:
import React from 'react';
import { MenuItem, FormControl, Select } from "@material-ui/core";
import './App.css';
function App() {
return (
<div className="app">
<h1></h1>
<FormControl className="app_dropdown">
<Select variant = "Outlined" value = "abc">
<MenuItem value="worldwide">Worldwide</MenuItem>
<MenuItem value="worldwide">Option 2</MenuItem>
<MenuItem value="worldwide">Worldwide</MenuItem>
<MenuItem value="worldwide">Worldwide</MenuItem>
</Select>
</FormControl>
{/* { Header } */}
{/* { Title + Select input dropdown field } */}
{/* { Info Box1 } */}
{/* { Info Box2 } */}
{/* { Info Box3 } */}
{/* { Table } */}
{/* { Graph } */}
{/* { Map } */}
</div>
);
}
export default App;
2个回答
看起来 Material UI 的
Select
组件的
variant
属性区分大小写。
它允许值
'filled' | 'outlined' | 'standard'
因此,要解决这个问题,只需将
Outlined
改为
outlined
<Select variant = "outlined" value = "abc">
95faf8e76605e973
2020-08-09
variant
应为小写的
outlined
,并且请将
value
和
onChange
属性传递给 select
function App() {
const [country, setCountry] = useState("")
return (
<div className="app">
<h1></h1>
<FormControl className="app_dropdown">
<Select variant = "outlined" value = {country} onChange={(e) => setCountry(e.target.value)}>
<MenuItem value="India">India</MenuItem>
<MenuItem value="USA">USA</MenuItem>
<MenuItem value="UK">UK</MenuItem>
</Select>
</FormControl>
</div>
);
}
export default App;
Shubham Chitransh
2020-08-09