Question

有什么办法可以缩短这段代码？唯一的区别是我希望在索引0处显示“全部”而不是数组值。

还是多个条件？就像在索引= 0处一样，执行此操作，在索引为％2处执行此操作，并在上一个索引处执行此操作？

我也找到了相同的解决方案。我现在遇到另一个问题，

我想在onClick中选择两个功能。

<a onClick={()=>{AddNewBookmark(userId, newsId); this.changeBookmarkState(isBookmarked, bookmarkIndex);}}>

我想要的是index == 0以使用AddNewBookmark（userId，newsId），或者如果index == 1则使用RemoveBookmark（userId，newsId）。

<a onClick={()=>{ index == 0 ? AddNewBookmark(userId, newsId) : 
 RemoveBookmark(userId, newsId); this.changeBookmarkState(isBookmarked, 
 bookmarkIndex);}}>

无论索引值是多少，我都希望包含changebookmarkstate。

我的尝试没有任何效果。有什么建议吗？

Answer 1

由于您所做的只是更改跨度中渲染的内容，因此可以在跨度内的JSX中进行逻辑处理

这应该有效：

isFiltered[index] && (
   <div key={index}>
     <span>{index == 0 ? "All" : category['Name']}</span>              
   </div>        
);

您还可以将此逻辑提取到函数中，然后在范围中调用该函数。如果您最终想要在该范围内显示一堆不同的结果，这会更干净。像这样：

helperFucntion(index: number) => (
   index == 0 ? "All" : category['Name']
)

isFiltered[index] && (
   <div key={index}>
     <span>{helperFunction(index)}</span>              
   </div>        
);

Answer 2

代码的最短形式可能是这样的：

isFiltered[index] && return (
          <div key={index}>
              <span">{ index ? "ALL" : category['Name'] }</span>              
         </div>        
);

Answer 3

您的代码似乎不完整，所以不能确定，但是您可以根据需要使用以下代码。

您可以在数组的开头插入一个新索引。

isFiltered.unshift['All'];

if (isFiltered[index]){
    return (
        <div key={index}>
            <span>{ category['Name']}</span>              
        </div>        
    );                   
}

缩短此代码的方法

3 个答案: