反应天然旋转图像标记使用变换

Question

我要做的是旋转图像标记，我有一系列的lat，在一个称为标记和轴承状态的状态下，我想将图像旋转到随着标记在地图上移动的轴承

 render() {
    return (
      <View style={styles.container}>
            <MapView style={styles.map}
            initialRegion={{
                    latitude: this.state.latitude,
                    longitude: this.state.longitude,
                    latitudeDelta: 0.01,
                    longitudeDelta: 0.01,
                }}
        >
          {Object.entries(this.state.markers).map((marker, index)=> (
              <MapView.Marker
                key= {index}
                coordinate={getCoordinates(marker)}
                title= {marker.title}
                discription= {index}
              >
                <Image source={require('./assets/test-50.png')} style={{transform: [{ rotate : '${marker.bearing}deg'}]}}/>
            </MapView.Marker>  
            ))}
            </MapView>  
      </View>
    );
   }

问题是我似乎无法将轴承添加为旋转的一部分

style={{transform: [{ rotate : '${marker.bearing}deg'}]}}

如果我投入了诸如" 45deg"之类的值，则可以正常工作，但我不确定如何在其中获得Dynaic值。不确定问题是什么，对不起，我对此非常友善，所以我想我缺少一些东西

Answer 1

style={{transform: [{ rotate : '${marker.bearing}deg'}]}}

如我所见，您使用了单语引号。您必须对此使用背键。它们也称为模板文字，该语法${variableName}仅在背键中起作用。有关更多信息，请访问此处：https://developer.mozilla.org/en-us/docs/web/javascript/Reference/template_literals