reactjs - 如果 .map 不返回，则为 else 语句

Question

我想检查 jobPosts === {} 是否意味着没有 jobPosts，如果是，请将 jobPostMarkup 设置为一个字符串，说明“未找到结果”，尽管我正在努力将功能应用到现有代码中？

render() {

const { jobPosts, loading,category, state } = this.props.data;

   let jobPostMarkup = !loading ? (

 jobPosts.map((jobPost) => 


 <JobPost key={jobPost.jobId} jobPost={jobPost} />)

) : ( 
<Skeleton/>

   )

Answer 1

render() {

const { jobPosts, loading,category, state } = this.props.data;

   let jobPostMarkup = !loading ? (

 jobPosts.map((jobPost) => 


 <JobPost key={jobPost.jobId} jobPost={jobPost} />)

) : ( 
<p> 
   )


if(Object.keys(jobPosts).length === 0) jobPostMarkup = "No Results Found";

只需要添加底线。

Answer 2

您可以计算对象包含的键的数量以查看对象是否为空。当对象有 0 个键时，这意味着它是空的。

完整的代码应该是

render() {

const { jobPosts, loading,category, state } = this.props.data;

   let jobPostMarkup = !loading ? (

   if(Object.keys(jobPosts).length === 0) jobPostMarkup = "No Results Found";


 <JobPost key={jobPost.jobId} jobPost={jobPost} />)

) : ( 

let jobPosts = {}

let jobPostMarkup = "";

if(Object.keys(jobPosts).length === 0) jobPostMarkup = "No Results Found";

console.log(jobPostMarkup)