El nombre de la clase del folleto no se aplica

Question

Estoy intentando sobrescribir el estilo de los tooltips de los folletos en un mapa pero parece que no utiliza mi estilo CSS. Estoy usando angular y electron pero por lo que sé ninguno de los dos debería causar ningún cambio en leaflet. (leaflet está instalado como una dependencia)

Mi función de adición de marcadores tiene este aspecto por el momento:

data.flights.map(function(plane){
  const positionVariable = {
    lat: parseFloat(plane.position.latitude),
    lng: parseFloat(plane.position.longitude)
  }
  if(westBound <= positionVariable.lng && eastBound >= positionVariable.lng && northBound >= positionVariable.lat && southBound <= positionVariable.lat){
    var tooltipOptions = {
      classname: 'labelstyle',
      permanent: true,
      direction: 'right',
      opacity: 1.0
    }

    var tooltipContent = plane.callsign

    return L.marker(positionVariable, {icon: greensquare}).addTo(markers).bindTooltip(tooltipContent, tooltipOptions);
  } else {
    return;
  }
})

Los marcadores y los consejos de herramientas se aplican correctamente, sin embargo, les falta el estilo personalizado que se encuentra en el archivo scss para el componente en el que se muestra el mapa:

.labelstyle{
  color: green;
  font-size:14px;
  font-weight: 700;
  background-color: none;
  border-color: none;
  background: none;
  border: none;
}

Answer 1

Utilice className en lugar de classname . Recuerde comprobar el Documentación del folleto para la ortografía correcta. Las cosas en javascript distinguen entre mayúsculas y minúsculas, y la mayoría de las veces no recibirás ninguna advertencia al respecto.