반응형
Vuetify 회전목마 높이 변경
의 높이를 낮출 수 있습니까?<v-carousel>
서류에서 작업 중인 것으로 봤는데, 아직 구현이 안 되었나요?그렇지 않다면 주변에 할 일이 있나요?난 그냥 최고 높이를 설정하려고 하는 거야.
자동 높이를 설정할 수 있습니다.
<v-carousel height="auto">
CSS를 사용할 필요도 없고, 중요한 것도 아닙니다.높이를 변경하려면 다음 중 하나의 받침대를 사용할 수 있습니다.
이름: 높이
디폴트: 500
Type: number | string 컴포넌트 높이를 설정합니다.
예.
<v-carousel height="500px">
<v-carousel-item
v-for="(item,i) in items"
:key="i"
:src="item.src"
></v-carousel-item>
</v-carousel>
기본 vue 컴포넌트 또는 이 컴포넌트가 있는 컴포넌트에서v-carousel
css 규칙을 추가합니다.
.carousel {
height: 200px !important;
}
더하다
!important
그것 없이는 안 된다면이 규칙을 메인 컴포넌트에 넣는 경우,
<style>
태그에 단어가 없습니다.scoped
그 안에
예를 들어 이미지를 기반으로 한 v-carousel의 동적 높이를 원하는 경우.
다음과 같은 것을 사용할 수 있습니다.
예:
<v-carousel :style="{'height': this.carouselHeight}">
<v-carousel-item v-for="(item, index) in items" :key="index" style="height: auto" :src="item.image"></v-carousel-item>
</v-carousel>
- 데이터 프로펠러 설정:
data () { return { carouselHeight: 0 { }
- 작성 방법:
getCarouselHeight () { var item = document.getElementsByClassName('v-image__image--cover') this.carouselHeight = item[0].clientHeight + 'px' }
- 마운트된 콜 메서드:
mounted () { this.getCarouselHeight() }
언급URL : https://stackoverflow.com/questions/51067412/changing-the-vuetify-carousel-height
반응형
'programing' 카테고리의 다른 글
MySQL/MariaDB의 다른 행에 있는 동일한 열에 있는 두 셀의 데이터를 병합합니다. (0) | 2022.11.21 |
---|---|
PHP의 stdClass란 무엇입니까? (0) | 2022.11.21 |
Android Studio에 번들된 JDK를 JAVA로 사용Mac에서의 홈 (0) | 2022.11.21 |
Mysql/Mariadb delete Query는 트랜잭션입니까?그리고 엄청난 수의 행에 대한 퍼포먼스? (0) | 2022.11.21 |
여러 테이블에서 LOCK TABLES (0) | 2022.11.21 |