无法在 if/else 代码块中正确设置元素样式

Question

我有一些来自虚拟后端的数据，例如：[ {  "title": "title title 0",  "date": "22/09/2015",  "author": "author00",  "langs": [   "react",   "javascript"   ] }, { "title": "title 1", "date": "09/11/2012", "author": "author188", "langs": [ "angular", "vue"   ] }],我尝试通过它的第一个元素来风格化“langs”数组，例如：const posts = this.state.posts.map(post => {      if (post.tags[0].startsWith("react")){        post.style.backgroundColor = "red";        }      }我认为“if”语句是正确的，但我不知道在代码块中尝试什么。当我尝试登录控制台时，它可以。但是这种情况下的很多事情取决于数组中的第一个 [0] 元素是什么......例如，如果第一个元素在 cideblock 中包含 'angular'，则许多样式选项必须重新排列为红色，并且当它包含 'react' 时，每种情况下的主导样式颜色都必须是蓝色。你能告诉我用 if/else 语句改变很多东西的风格的最佳解决方案是什么？

Answer 1

制作一个颜色图，定义代码标签的颜色，如下所示：

const colorMap = { 'react': 'red', 'angular': 'blue' };

然后像这样使用它：

const posts = this.state.posts.map(post => {

      const tag = post.tags[0];

      const color = colorMap[tag];

      post.style.backgroundColor = color;

});