"Object is possibly undefined" in for observable 字段
"Object is possibly undefined" in for observable field
获取数据并设置观察数组,代码如下:
import {observable} from 'mobx';
export interface IMenuModel{
Id:number
itemName:string;
parentId?:number;
}
class MenuRepo {
@observable menuItems? : IMenuModel[];
constructor(){
}
getItems():void {
fetch(`..`).then((response: Response): Promise<{ value:IMenuModel[] }> => {
return response.json();
})
.then((response: { value: IMenuModel[] }) : void => {
this.menuItems = response.value;
}, (error: any): void => {
//exception handling
});
}
}
var menuCodes = new MenuRepo
export default menuCodes;
这是观察者class;
import * as React from 'react';
import {observer} from 'mobx-react';
import {IMenuModel} from './Codes';
@observer
class Menu extends React.Component<{params?:IMenuModel[]}, {}> {
render() {
debugger
var menuJSX : JSX.Element[] = this.props.params.map((item:IMenuModel, i:number)=>{
return (<li key={item.Id}>{item.itemName}</li>)
});
return (
<div>
Hello World!!!!
<br />
{menuJSX}
</div>
);
}
}
export default Menu;
我也遇到上面的错误("this.props.params" 红色下划线):Object is possibly 'undefined'
不知道如何修复它..这是主要组件;
import menuCodes from './components/Codes';
class App extends React.Component<null, null> {
render() {
return (
<div className="App">
<Menu params = {menuCodes.menuItems}/>
</div>
);
}
}
我认为这是一个特定于 Typescript 的错误。
Menu
组件中的 params
道具是可选的。因此,我假设在您的 MenuCodes
组件中,menuCodes.menuItems
有时可能是 undefined
。
如果您在 this.props.params
上进行映射,并且它可能在某些时候未定义,则您需要在 menuJSX
变量的赋值中包含一个条件来说明何时 menuCodes.menuItems
(因此 props.params
)是 undefined
。
像这样的三元数:
const { params } = this.props
var menuJSX : JSX.Element[] = params
? params.map((item:IMenuModel, i:number) =>
<li key={item.Id}>{item.itemName}</li>
)
: [];
获取数据并设置观察数组,代码如下:
import {observable} from 'mobx';
export interface IMenuModel{
Id:number
itemName:string;
parentId?:number;
}
class MenuRepo {
@observable menuItems? : IMenuModel[];
constructor(){
}
getItems():void {
fetch(`..`).then((response: Response): Promise<{ value:IMenuModel[] }> => {
return response.json();
})
.then((response: { value: IMenuModel[] }) : void => {
this.menuItems = response.value;
}, (error: any): void => {
//exception handling
});
}
}
var menuCodes = new MenuRepo
export default menuCodes;
这是观察者class;
import * as React from 'react';
import {observer} from 'mobx-react';
import {IMenuModel} from './Codes';
@observer
class Menu extends React.Component<{params?:IMenuModel[]}, {}> {
render() {
debugger
var menuJSX : JSX.Element[] = this.props.params.map((item:IMenuModel, i:number)=>{
return (<li key={item.Id}>{item.itemName}</li>)
});
return (
<div>
Hello World!!!!
<br />
{menuJSX}
</div>
);
}
}
export default Menu;
我也遇到上面的错误("this.props.params" 红色下划线):Object is possibly 'undefined'
不知道如何修复它..这是主要组件;
import menuCodes from './components/Codes';
class App extends React.Component<null, null> {
render() {
return (
<div className="App">
<Menu params = {menuCodes.menuItems}/>
</div>
);
}
}
我认为这是一个特定于 Typescript 的错误。
Menu
组件中的 params
道具是可选的。因此,我假设在您的 MenuCodes
组件中,menuCodes.menuItems
有时可能是 undefined
。
如果您在 this.props.params
上进行映射,并且它可能在某些时候未定义,则您需要在 menuJSX
变量的赋值中包含一个条件来说明何时 menuCodes.menuItems
(因此 props.params
)是 undefined
。
像这样的三元数:
const { params } = this.props
var menuJSX : JSX.Element[] = params
? params.map((item:IMenuModel, i:number) =>
<li key={item.Id}>{item.itemName}</li>
)
: [];