前端vue开发百度地图标记使用＜bm-marker＞遇到改变标记数组元素，标记不及时动态刷新标记位置信息和元素下标。

本文本主要记录在改变（删除，编辑移动标记后通过下面方式展示得标记图标获取得标记数组下标（索引）不正确问题），如有需要接入百度地图开发请自行百度

问题：

 <bm-marker :averageCenter="true" v-for="(item, index) in signs" :key="item.id" 
              :position="{ lng: item.latlon.split(',')[0], lat: item.latlon.split(',')[1] }"               :dragging=item.dragging
              :icon="{
                url: item.layerLink,
                size: { width: 50, height: 50},
              }" @click="signMarkerDetail(item,index)" @dragend="dragend" :offset="{width:11,height:0}">
              <bm-label v-if="item.name!=null" :content="item.name"
                :labelStyle="{color: 'back', fontSize : '12px',background:'white',borderColo                 r:'red'}"
                :offset="{width: 30,height:15}">
              </bm-label>
 </bm-marker>

通过上面代码遍历数组展示标记，在进行某一中间标记编辑（移动），删除（本人是使用下面代码实现删除和编辑）后发现已加载得标记列表下标不会更新，既通过@click="signMarkerDetail(item,index)" 获取得数组下标是错误的，是未操作前的下标。

 1、self.signs.splice(index, 1)方法去除数组元素为index的元素后使用signs.push(新元素)方式实现删除，
2、通过self.signs.splice(index, 1，新数组元素)方式实现标记的编辑

抛开删除数组元素标记下标错误，就说编辑使用上面代码操作后正常获取数组下标（因为使用该方法操作数组，数组下标没改变过，是正常的），在编辑移动标记后想取消编辑，发现标记在两次操作后无法回到移动前的经纬度位置；虽然重新刷新页面后标记位置不变，但不是编辑点击取消就能恢复原先经纬度位置效果。

解决办法：

经过不断努力发现不管删除、编辑操作都是是<bm-marker>标记元素没有动态刷新dom元素引起的问题。

1. 百度的觉得办法是监听标记数组的变化，再利用函数去更新，具体方法：Vue组件通过动态绑定对象更新后子组件百度地图视图无刷新的解决方式  但本人没尝试这方法。

2. 本人解决办法：

    注意：下面signs数组已正常绑定v-modle，下面只是更新数组元素    
        let self=this  
        self.signs.splice(index,1,result) //编辑，替换元素
        self.signs.splice(index,1) //删除，移除元素
         let copy=self.signs
          self.signs=[]
          // 当数据被修改后使用这个方法（$nextTick({})），会回调获取更新后的dom再渲染出来
          //使用它每次编辑（移动）、删除标记后可以重新加载dom渲染原来的标记位置
          self.$nextTick(() => {
          for(let i=0;i<copy.length;i++){
              self.signs.push(copy[i])
            }
            })  

在编辑取消，删除成功等操作方法成功操作后，先把原标记数组赋值给中间值，然后清空，清空后在下面

//this.$nextTick 将回调延迟到下次DOM更新循环之后执行。在修改数据之后立即使用它，然后等待DOM更新。
self.$nextTick(() => {
//更新回调操作
})

方法内重新赋值给原标记数组，上面问题就可以解决了

本人在解决过程中遇到的坑：

避坑一：

原本调用self.signs.splice(index,1)删除标记元素后利用self.signs.push(元素)添加标记信息，以为可以正常更新百度地图上的标记信息显示，结果通过上面方法获取标记数组下标index时发现原有的下标没变（删除元素，正常数组已经重新更新下标，长度）。调试很久以为是splice函数的问题无法更新下标索引index，结果不是。白搞。

避坑二：

接着坑一，以为是splice函数问题，操作更改标记数组signs后手动遍历，重新赋值，结果效果和坑一一样，无法动态刷新百度地图上的标记信息，获取的标记还是更改前的下标索引。