微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

如何解决使用 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'
    }
  }

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。