Vuejs2 GeoJSON—onEachFeature中的方法

是一个在Vue2框架中实现传单的库；能够在地图上显示GeoJSON对象

对于多个GeoJSON行，我希望有一个鼠标单击事件影响其他行的样式（例如，它切换

selectedLineId

变量）。我设法改变了鼠标在其上的geojson行的样式；看这个

核心是

onEachFeature

，它将鼠标悬停事件添加到每个功能中。但我不知道如何从这里运行Vue方法

function onEachFeature (feature, layer) {
    layer.on('mouseover', function (e) {
        e.target.setStyle({
            color: "#FF0000"
        });
    });
    layer.on('mouseout', function (e) {
        e.target.setStyle({
            color: "#000000"
        });
    });
}

您可以将

onEachFeature

功能添加到Vue对象：

data（）{
返回{
// ...
线路：{
geojson:geojsondata，
选项：{
onEachFeature:onEachFeature.bind（此），
风格：{
颜色：“000000”
}
}
}
}
}

此

在

onEachFeature

中将引用您的Vue对象：

功能特性（特性，图层）{
var v=这个；
层上（'mouseover'，函数（e）{
//假设已定义getColor方法
e、 target.setStyle({
颜色：v.getColor（）
});
});
层上（'mouseout'，函数（e）{
e、 target.setStyle({
颜色：“000000”
});
});
}

---

这里有一个更新的Fiddle:

tnx，但似乎该方法仅在初始化期间运行在我的示例中，是的，因为

onEachFeature

在初始化时调用，而不是在鼠标事件时调用。我修改了这个示例，以展示如何在mouseover上引用Vue对象。已经帮了我很多忙！现在我只需要动态更改对象的样式（）非常感谢！