编码部分工作。
我正在尝试通过reactjs从Atlassian示例获取记录。关于{codes ? JSON.stringify(codes) : 'Loading record'}
我可以得到记录如下
[{"value":{"idx":"100","name":"php"},"key":"mykey"}]
以下是我的问题:当我决定按照下面的代码Map记录时,我在浏览器控制台中看到错误
**TypeError: M is null
Qd App.js:**
{codes.map(code => (
<div>
<b>{code.value.idx}</b><br/>
<b>{code.value.name}</b><br/>
</div>
))}
{codes.length === 0 && <div>No Record Found</div>}
这是整个代码
App.js
import React, { useEffect, useState, Fragment } from "react";
function App() {
const [codes, setCodes] = useState(null);
useEffect(() => {
invoke('mymethod').then(setCodes);
}, []);
return (
<div>
<h2> Display Codes Data</h2>
{codes.map(code => (
<div>
<b>{code.value.idx}</b><br/>
<b>{code.value.name}</b><br/>
</div>
))}
{codes.length === 0 && <div>No Record Found</div>}
{codes ? JSON.stringify(codes) : 'Loading record'}
</div>
);
}
export default App;
index.js
import Resolver from '@forge/resolver';
import api, { route } from "@forge/api";
const resolver = new Resolver();
resolver.define('mymethod', async (req) => {
const res = await storage.query().where('key', startsWith('mykey')).limit(20).getMany();
console.log(res);
return res.results;
});
export const handler = resolver.getDefinitions();
1条答案
按热度按时间igsr9ssn1#
这里,
codes
最初是null
,所以第一次渲染codes.map()
和codes.length
时会抛出错误。尝试将状态初始化为空数组.
或
使用optional-chaining安全地呼叫
.map()
和.length
我的首选是第一个选项,因为这意味着你不必担心任何地方可能的
null
值。