我有一个简单的,功能的滑动器工作在Vue 3与Swiper.js 8.4.5
工作关闭these Vue examples(无滚动条和A11 y)。
第一个
我要修改导航参数的元素(大小、颜色等),但一直无法找到一种方法来实现这一点。我这样做主要是试图修改视图的scoped样式块中的css我甚至试过跳过import 'swiper/css/navigation';
,但这也不起作用,我能找到的类似更改的例子似乎适用于不是为Vue 3编写的Swiper.js版本。
Swiper.js文档显示:
请注意,如果您传递这些参数而未指定其元素(例如,没有navigation.nextEl、pagination.el等),Swiper Vue.js组件将为Navigation、Pagination和Scrollbar创建所需的元素。
我得出了一个类似的结论,即在传递setup()
方法之前,需要将我的更改添加到Navigation
模块中;然而,我似乎找不到一个如何做到这一点示例。
在Vue 3中修改Swiper组件的“最稳健”方式是什么?
编辑1:顺便说一句,这种方法也不成功:
:navigation="{enabled: true, prevEl: '.myPrev', nextEl: '.myNext'}"
2条答案
按热度按时间pbossiut1#
通常,为了能够定制任何类型的UI组件(它是类似于Bootstrap或UI包的东西),您用途:
:deep
!important
可能有些过头,但这是覆盖此类项目的一个很好的例子arknldoa2#
使用
id
而不是class
允许我自定义滑块对象(它仍然需要大量的工作)。也可能有一个特定的类引用将工作,但我尝试的选项被忽略(或覆盖)。第一个