使用 Vue / Nuxt 删除传单属性?

问题描述

我看到了一些关于如何删除右下角传单归属的主题。 传单的创建者似乎对此没有任何问题,因此为了节省空间,我想删除我的。 这是一个关于它的线程,但不幸的是没有与 Vue 相关的答案。 https://gis.stackexchange.com/questions/192088/how-to-remove-attribution-in-leaflet

我正在使用 nuxt,但如果它是针对 Vue 的,我将不胜感激。 l-tile-layer 有一个 attribute-prop 确实可以帮助我添加属性,但是删除它让我意识到属性似乎与 l-map 组件有关,因为它在没有 tile 层的情况下可见。

TLDR:我想删除“传单”

enter image description here

建议?

解决方法

使用 Leaflet API,它会被这个配置删除。

https://leafletjs.com/reference-1.7.1.html#map-attributioncontrol

L.map('map',{
    attributionControl: false
}

使用 vue2-leaflet 似乎可以对 options 属性做同样的事情

https://vue2-leaflet.netlify.app/components/LMap.html#props

<l-map
  :options="{attributionControl: false}"
>
      ...
</l-map>
,

正如 Kunukn 指出的那样(并且 mikeu 在这里也友好地提供了答案:Link to github

Vue 的解决方案是添加 attributionControl:false 选项。 然而,我的要求是保留我的其他属性,但幸运的是,在尝试了一点之后,我只需要添加带有空前缀的 l-control-attribution 组件。

在 HTML 中

<l-map :zoom="8" :center="[59.3293,18.0686]" :options="{ attributionControl: false }">
<l-tile-layer url="http://localhost:8080/styles/mytheme/{z}/{x}/{y}.webp" :attribution=attribution>
</l-tile-layer>
<l-control-attribution position="bottomright" prefix=""></l-control-attribution>
</l-map>

在脚本中

data(){
    return{
      attribution: 
        '&copy;<a href="https://openmaptiles.org/">OpenMapTiles</a> &copy;<a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
    }
  }