jacob's questions

Criei um botão com um popover como este:

Aqui está o código do modelo Vue:

<template>
  <div :class="['lang-button', { 'in-list': listItem } ]">
    <k-button id="lang-button" :raised="!listItem" clear class="py-3 px-3">
      <font-awesome-icon icon="earth-americas" class="mr-2" />
      {{ $t('common.language') }}
    </k-button>
    <ion-popover trigger="lang-button" :dismiss-on-select="true">
      <ion-content class="lang-button-popover-content">
        <ion-list>
          <ion-item :button="true" :detail="false" @click="setLanguage('en')">English</ion-item>
          <ion-item :button="true" :detail="false" @click="setLanguage('es')">Español</ion-item>
        </ion-list>
      </ion-content>
    </ion-popover>
  </div>
</template>

Infelizmente, o último item (Espanhol) tem uma borda inferior que eu quero remover. No Chrome Inspector, eu posso fazer isso:

Parece melhor depois:

Mas não consigo descobrir como estilizá-lo em código para fazer isso. Eu tentei:

ion-item::part(native) {
  .item-inner {
    border-bottom-width: 0;
  }
}

e um monte de outras variações, e nada funciona. Como você remove o estilo div.item-innerpara remover essa margem inferior?

Obrigado.

Eu tenho um Vue SFC com dois <script>blocos: um para configuração e outro para beforeRouteEntero manipulador do roteador vue que não pode ser usado na configuração. Ambos podem usar algumas das mesmas importações. Ao executá-lo npm run dev, é necessário que cada bloco de script o importe independentemente do outro bloco, mas ao executar npm run buildo compilador TypeScript (ou linter) gera um erro:

src/components/MyComponent.vue:72:8 - error TS2300: Duplicate identifier 'auth'.

import auth from '@/auth'

Qual é a abordagem adequada aqui para lidar com esse problema?