在react-native中动态更改View的背景颜色

Question

一组颜色来自数据库。我想动态地将Ex: { "user1": { "myparams3": 1, "myparam4": { "http://www.seloger.com/erreur-temporaire/binde": 1, "http://www.seloger.com/erreur-temporaire/husk-pie": 1 } } } 的颜色更改为DB数据（颜色）。

必填输出 https://i.stack.imgur.com/rPBWE.png

我的代码

View

此代码在初始化<View style={{ flexDirection: 'row'}}> { this.state.data.variants.map((data, index) => ( var bg_color = data.option_values[1].value <TouchableOpacity style={{height: 30, width: 30, borderRadius: 15, backgroundColor: {bg_color}, marginHorizontal: 3}}> </TouchableOpacity> )) } </View> 时发出unexpected token错误。我不知道如何将DB数据传递给反应原生样式。任何人都可以解释如何将DB数据传递给样式。

感谢任何帮助。谢谢。

Answer 1

如果你想为map添加逻辑，你应该改变它以便返回一些东西：

{
   this.state.data.variants.map((data, index) => {
       var bg_color = data.option_values[1].value
       return(
           <TouchableOpacity style={{height: 30, width: 30,  borderRadius: 15, backgroundColor: bg_color, marginHorizontal: 3}}>
           </TouchableOpacity>
       )
   })
}