Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/react-native/7.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
React native react native maps Marker的道具zIndex在iOS 11中无法正常工作_React Native_Ios11_React Native Maps - Fatal编程技术网

React native react native maps Marker的道具zIndex在iOS 11中无法正常工作

React native react native maps Marker的道具zIndex在iOS 11中无法正常工作,react-native,ios11,react-native-maps,React Native,Ios11,React Native Maps,在iOS 11Zindex中,当我通过更改状态选择标记时,marker react本机地图的道具无法正常工作,因为当我移动地图时,所选标记会传递到背景。只有当我按下记号笔时效果才好 在Android或iOS中,10,9,8可以正常工作 黄色标记必须位于前景 拜托,有人知道我怎么解决这个问题吗 我的代码: import React, { Component } from 'react'; import { StyleSheet, Text, View, TouchableOpaci

在iOS 11Zindex中,当我通过更改状态选择标记时,marker react本机地图的道具无法正常工作,因为当我移动地图时,所选标记会传递到背景。只有当我按下记号笔时效果才好

在Android或iOS中,10,9,8可以正常工作

黄色标记必须位于前景

拜托,有人知道我怎么解决这个问题吗

我的代码:

import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  Dimensions
} from 'react-native';
const { width, height } = Dimensions.get('window');
import MapView, { PROVIDER_GOOGLE, PROVIDER_DEFAULT } from 'react-native-maps';
const { Marker } = MapView;
export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      index: 0
    };
    this.markers = [
      { id: 1, latitude: 43.152, longitude: -1.30051 },
      { id: 2, latitude: 43.1525, longitude: -1.30201 },
      { id: 3, latitude: 43.15264, longitude: -1.30025 },
      { id: 5, latitude: 43.1527, longitude: -1.30201 },
      { id: 6, latitude: 43.1525, longitude: -1.3001 },
      { id: 7, latitude: 43.1527, longitude: -1.30043 },
      { id: 8, latitude: 43.1526, longitude: -1.300531 },
      { id: 9, latitude: 43.1525, longitude: -1.30011 },
      { id: 10, latitude: 43.1521, longitude: -1.30062 },
      { id: 4, latitude: 43.152, longitude: -1.30083 }
    ];
  }
  render() {
    return (
      <View style={styles.container}>
        <MapView
          provider={PROVIDER_DEFAULT}
          style={{ flex: 1 }}
          initialRegion={{
            latitude: 43.153,
            longitude: -1.3,
            longitudeDelta: 20,
            latitudeDelta: 15
          }}
          minZoomLevel={15}
          ref={ref => { this.map = ref }}>
          {this.markers.map((marker, i) => {
            const selected = this.state.index == i;
            return (
              <Marker
                key={'m' + marker.id}
                coordinate={{ latitude: marker.latitude, longitude: marker.longitude }}
                onPress={() => this.setState({ index: i })}
                zIndex={selected ? 2 : 1}>
                <View style={[styles.marker, selected ? {zIndex:2} : {zIndex:1}]}>
                  <View style={styles.bubbleContainer}>
                    <View style={[styles.bubble, selected && styles.selected]}>
                      <Text style={styles.txt}>test</Text>
                    </View>
                  </View>
                </View>
              </Marker>
            );
          })}
        </MapView>
        <TouchableOpacity onPress={() => this.setState({ index: Math.round(Math.random() * 10) })}>
          <Text>Random select</Text>
        </TouchableOpacity>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    backgroundColor: '#fff',
    height
  },
  marker: {
    width: 50
  },
  bubbleContainer: {
    flexDirection: 'column',
    alignSelf: 'flex-start',
    backgroundColor: 'transparent',
    height: 45,
  },
  bubble: {
    flex: 0,
    flexDirection: 'row',
    alignSelf: 'flex-start',
    justifyContent: 'center',
    padding: 10,
    borderRadius: 10,
    borderColor: '#D1D1D1',
    borderWidth: 1,
    width: 49,
    backgroundColor: '#fff',
  },
  txt: {
    color: '#000',
  },
  selected: {
    backgroundColor: '#F7FF00'
  },
});
注册护士:0.48.4/0.50.4

RN地图:0.16.4/0.18.1


操作系统:iOS 11/11.1

我已经解决了编辑AIRMapMarker.m文件的问题

我观察到,当你点击一个标记时,zIndex工作得很好。因此,我在C Swift代码中看到了方法setSelected,并在setZIndex中复制了该方法

我写了一篇有条件的文章:

- (void)setZIndex:(NSInteger)zIndex
{
    if (zIndex == 2) {  // added line
        [self setSelected:YES animated:NO]; // added line
    } else { // added line
        [self setSelected:NO animated:NO]; // added line
    } // added line
    _zIndex = zIndex;
    self.layer.zPosition = _zIndex;
}

它是硬编码的,但工作正常。

这似乎是一个iOS 11错误。。还有一个github问题解决了这个问题:我创建了这个问题:3。我在等Airbnb的回复。