TypeError: Cannot read property 'map' of undefined in react with UseState
TypeError: Cannot read property 'map' of undefined in react with UseState
所以我正在用 react 编写这个应用程序,它允许您向图像添加滤镜,我收到错误“TypeError:无法读取未定义的 属性 'map'”我正在使用具有 UseState 的功能组件。默认选项是过滤器。这是App.js
import React, { useState } from 'react'
import './App.css';
import Slider from './Slider'
import SidebarItem from './SidebarItem'
const DEFAULT_OPTIONS = [
{
name: 'Brightness',
property: 'brightness',
value: 100,
range: {
min: 0,
max: 200
},
unit: '%'
},
{
name: 'Contrast',
property: 'contrast',
value: 100,
range: {
min: 0,
max: 200
},
unit: '%'
},
//...
]
function App() {
const { options, setOptions } = useState(DEFAULT_OPTIONS)
return (
<div className="container">
<div className="main-image" />
<div className="sidebar">
{options.map((option, index) => {
return (
<SidebarItem
key={index}
name={option.name}
/>
)
})}
</div>
<Slider />
</div>
)
}
export default App;
使用useState
时不是花括号。这是一个数组
const [ options, setOptions ] = useState(DEFAULT_OPTIONS)
所以我正在用 react 编写这个应用程序,它允许您向图像添加滤镜,我收到错误“TypeError:无法读取未定义的 属性 'map'”我正在使用具有 UseState 的功能组件。默认选项是过滤器。这是App.js
import React, { useState } from 'react'
import './App.css';
import Slider from './Slider'
import SidebarItem from './SidebarItem'
const DEFAULT_OPTIONS = [
{
name: 'Brightness',
property: 'brightness',
value: 100,
range: {
min: 0,
max: 200
},
unit: '%'
},
{
name: 'Contrast',
property: 'contrast',
value: 100,
range: {
min: 0,
max: 200
},
unit: '%'
},
//...
]
function App() {
const { options, setOptions } = useState(DEFAULT_OPTIONS)
return (
<div className="container">
<div className="main-image" />
<div className="sidebar">
{options.map((option, index) => {
return (
<SidebarItem
key={index}
name={option.name}
/>
)
})}
</div>
<Slider />
</div>
)
}
export default App;
使用useState
时不是花括号。这是一个数组
const [ options, setOptions ] = useState(DEFAULT_OPTIONS)