记一次openlayers 添加交互修改样式的Bug

openlayers版本：4.6.4

实现功能：鼠标移入要素修改要素的样式

效果：

鼠标移入前：



鼠标移入后：



移入前样式代码：这里使用的styleFunction

//面样式方法
polygonStyleFunction:function(feature,resource){
var style = new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0)'
}),
stroke: new ol.style.Stroke({
color: '#5076b3',
width: 0.5
}),
text: new ol.style.Text({
font: '12px 微软雅黑,sans-serif',
fill: new ol.style.Fill({
color: '#ffffff'
}),
placement:'point',
//标签的边框
backgroundStroke:new ol.style.Stroke({
color:'#4D98DD',
width:1
}),
//标签的背景填充
backgroundFill:new ol.style.Fill({
color:'#4D98DD'
})
})
});
if(feature.get('name')){
style.getText().setText(feature.get('name'));
}
return [style];
}

鼠标移入后样式:

var polygonHighlightStyle = new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#ff1824',
width: 2
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.0)'
}),
text: new ol.style.Text({
font: '12px 微软雅黑,sans-serif',
fill: new ol.style.Fill({
color: '#4c76cc'
}),
placement:'point',
backgroundStroke:new ol.style.Stroke({
color:'#feff2a',
width:1
}),
backgroundFill:new ol.style.Fill({
color:'#feff2a'
}),
text:"测试"
})
});

// TODO 滑过高亮---------移入高亮
polygonPointerMove = new ol.interaction.Select({
condition: ol.events.condition.pointerMove,      /** 移动触发*/
style:function (feature) {
if(feature.get('name')){
polygonHighlightStyle.getText().setText(feature.get('name'));
}
return [polygonHighlightStyle];
},
layers:[beijingLayer,jiedaoLayer,shequLayer]
});

到这里，一切正常，效果也符合预期，鼠标移入时，字体替换为 黄底蓝字的样式，移到其他也没什么问题。。

滑着滑着就出现了一个问题：



当移到中间这个要素的时候，其他样式的Text属性的 背景全消失了，而只有移入这个要素的时候才会有这个问题。。。。。。。。。。。。。。。

我以为时哪里出现了问题，然后换其他图层，



然后试了很多种方法，都无法解决这个问题，当我想是不是要素加载的顺序的原因的时候发现也不是这个问题

如果有大神知道请告诉我