Блог

Я использую флажок v в таблицах на разных страницах в проекте vue js.

css, который я использовал на странице x

 .v-input__slot {
  align-items: center;
  justify-content: center;
}
.v-input--selection-controls {
  padding-left: 41%;
}
 

css, который я использовал на странице y

 .v-input__slot  {
  align-items: center;
  justify-content: center;
}
.v-input--selection-controls {
  padding-left: 15%;
}
 

Когда я перехожу со страницы x на страницу y, css на странице x остается на странице y. То же самое происходит, когда я переключаюсь со страницы y на страницу x. Как я могу предотвратить это

CSS страницы X активны на обеих страницах.

Вы должны добавить ключевое scoped слово на style свою страницу, чтобы создать локальный стиль для своего компонента. Например:

  <style scoped>
     .v-input__slot {
        align-items: center;
        justify-content: center;
     }
     .v-input--selection-controls {
        padding-left: 41%;
     }
 </style>
 

Вы можете прочитать больше о местном и глобальном стиле здесь