问题标签 [vue-slider-component]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2123 浏览

html - 将 %+- 附加到输入字段视图

我正在使用与输入字段绑定的两种方式的 vue 组件。

我想仅在输入字段视图中为此值附加一个 +- 和一个 % 符号。我不想更改实际值,因为这会导致组件出现问题。

这是我正在寻找的:

在此处输入图像描述

这是我所拥有的:

在此处输入图像描述

使用此代码:

- - - - - - - - - 更新 - - - - - - - - - -

根据下面使用计算属性的答案。

好的:

在此处输入图像描述

不好

在此处输入图像描述

所以我需要这个双向工作

0 投票
0 回答
543 浏览

vuejs2 - 如果内容是视频,Vue 真棒 swiper 播放视频

我正在使用 Vuejs2 和 vue awesome swiper,我可以在滑块中添加视频自动播放,但是当视频数据中的幻灯片处于活动状态时,我无法控制视频播放。仅当视频中的滑块处于活动状态时,视频可以自动播放吗?

这是我的代码

谢谢

0 投票
1 回答
997 浏览

javascript - 如何在 Laravel 5.6 中使用 vue-slider-component

我想在我的面板中添加一个滑块。我已安装

然后我创建了一个新组件并注册了app.js

在我的 Slider.vue 组件中,我添加了 startet 模板

并导入了 vueSlider

我得到了滑块。不幸的是,我不能滑动它并在开始时立即获得 maxValue。就像在这张照片中一样 在此处输入图像描述 ,就是这样。我在哪里点击都没关系,它什么也不做。当我想更改诸如更改 dotSize 之类的选项时,它也什么也不做。

我注意到当我打开控制台(F12)时它工作得很好。

滑块包装在 bootstrap 3 面板中。

我错过了什么?

更新 1:

我将值拉到选项之外,现在我得到了:

在此处输入图像描述

0 投票
1 回答
1574 浏览

vue.js - Vue Slider Component - 同时启用拖尾和点击更新

vue-slider-component在我的项目中使用。默认情况下,clickable即它在点击事件上应用更新(调用所需的方法)。但它也在拖动时不断地应用更新,从起点到终点。我想要的是仅once在滑块停止在终点时应用更新。所以我添加了@drag-end属性。现在的问题是我可以单击滑块,它会设置动画(幻灯片)但由于@drag-end属性的原因没有应用更新。我怎样才能保留@drag-end功能但同时启用点击更新应用?

0 投票
0 回答
180 浏览

vue.js - npm install 后,Vue-slider-component 未显示在 DOM 中

我在我的应用程序中使用 Vue-Slider-Component(V 3.0.31),它曾经工作得很好。后来当我出于其他目的运行 npm install 时,滑块停止显示在浏览器中,我什至在 DOM 中都看不到它。基本上它不是渲染。我发现 vue-slider-component 的版本已更新到 3.0.33,然后我尝试再次重新安装它。我看到一些奇怪的事情正在发生。几次尝试安装 vue-slider-component 时,package.json 中出现的默认版本是

滑块工作得很好。但是,有时在重新安装时,默认版本会出现 -

并且滑块组件不会显示出来。我的包含滑块的代码已经到位。我只是想弄清楚为什么会发生这种情况。我将此依赖项保存为我的 package.json 中的开发依赖项。

我已删除 ^(以确保版本不会更新),当我尝试手动安装 3.0.31 版本时,它仍然没有出现。我看到我的 package.json 和 package-lock 中的版本相同.json。

我什至尝试过删除节点模块并重新安装,但它似乎不起作用。

有人可以帮助我了解这里到底发生了什么以及为什么我会看到这个问题。

0 投票
2 回答
897 浏览

vue.js - Vue Slick Carousel 无法将图像作为链接

我正在使用 vue-slick-carousel 来构建一个滑块。我包装为链接的图像有问题。当我单击图像重定向时不会发生。此外,我在图像下还有一个标题,我也将其包装为链接,并且带有文本效果很好,但是当我单击图像时却没有。它不仅在移动设备上工作,在桌面上当我点击图像时它会重定向。

这是我的代码:

0 投票
2 回答
972 浏览

vue.js - 如何在 vue-slider 中设置没有最大值的范围

我正在使用vueSlider

查看下面链接的示例,我认为只能设置 min 和 max 中的整数。

例子

但我想设置一个不是整数的范围。例如,我想在范围内设置从 30 秒到 1:30 分钟的值。

有没有办法在 vue-slider 中实现类似上面的例子?

如果不能,请让我知道您是否有其他选择。

感谢您阅读我的问题。

0 投票
1 回答
1661 浏览

javascript - 如何在 vue-slick-carousel 中更改点样式

我在 Vue js 应用程序中使用vue-slick-carousel包我想更改滑块点样式更改颜色、背景、宽度、高度等我该如何实现?这是我的代码

0 投票
0 回答
138 浏览

javascript - VueJS - 如何自定义 vue-slider-component 的滑块栏?

我是 Vue js 的新手,我正在使用 vue-slider-component。我想将滑块设计成三角形,如下所示。

在此处输入图像描述

我想知道如何将滑块自定义为这个特定的形状。提前致谢。

0 投票
1 回答
138 浏览

javascript - Vue-slider 具有正确的数据,但将两个滑块工具提示都放在滑块的末尾

我正在使用“vue-slider”组件根据价格对产品进行分类。我面临的问题是,即使数据已正确加载并发送到“vue-slider”实现。滑块上的工具提示(可拖动的点)出现在滑块的末端。我想在滑块的开头有第一个工具提示,最后有第二个。getMin 和 getMax 通过字符串插值 {{getMin}} 和 {{getMax}} 读取,这两个值都显示正确的值,1 和 800(美元)。这让我想知道为什么两个工具提示仍然在滑块的末尾。

我使用以下代码在前端显示滑块数据:

此滑块背后的逻辑基于组件。我用于此的代码如下: