supermall icon indicating copy to clipboard operation
supermall copied to clipboard

关于轮播图div.swiper的困惑

Open lightersss opened this issue 4 years ago • 2 comments

老师您好,有点轮播图的问题想请教一下

<div class="swiper">
        <slot></slot>
 </div>

在html中会被加上transition和transform

<div data-v-bc58910a="" class="swiper" style="transform: translate3d(-415px, 0px, 0px); transition: all 0ms ease 0s;">

请问下这边的style是怎么加上的呢? 因为template中没有v-bind,而script中关于transform和transition的内容都被赋值给了data中的swiperStyle变量,所以不太清楚最终怎么反应到了style上

lightersss avatar Apr 13 '21 16:04 lightersss

老师您好,我又仔细查看了一下代码,现在有了一点自己的想法。 在134行的this.swiperStyle = swiperEl.style;中swiperEl.style是一个对象,在赋值的过程中是把this.swiperStyle这个指针指向了内存中的CSSStyleDeclaration这个对象,当修改swiperStyle 的时候其实swiperEl.style也已经修改了,所以能够反映到let swiperEl = document.querySelector('.swiper');这个DOM节点上。 如果理解的不正确,还请王老师指正

lightersss avatar Apr 14 '21 05:04 lightersss

老师您好,我又仔细查看了一下代码,现在有了一点自己的想法。 在134行的this.swiperStyle = swiperEl.style;中swiperEl.style是一个对象,在赋值的过程中是把this.swiperStyle这个指针指向了内存中的CSSStyleDeclaration这个对象,当修改swiperStyle 的时候其实swiperEl.style也已经修改了,所以能够反映到let swiperEl = document.querySelector('.swiper');这个DOM节点上。 如果理解的不正确,还请王老师指正

你这个理解是对的

lidaye910416 avatar Mar 21 '22 13:03 lidaye910416