带有点的jQuery ui滑块在vue元素内不起作用

时间:2018-07-21 20:21:55

标签: jquery-ui vuejs2 jquery-ui-slider-pips

所以我有一个带有pips扩展名的简单Jquery UI Slider。如果将滑块放在HTML的主体中,则效果很好。当我将其放入我的任何Vue.js元素中时,它停止工作但可见。我对Vue.js很陌生。 Vue元素内是否可以解决Jquery UI Slider?还是带有点的Vue.js滑块?

HTML-这只是整个Vue元素的一部分。实际上,这是Vue元素中模态的一部分。

<div class="settings-container" v-if="showingDashSettings">
    <h4>Dashboard Settings</h4>
    <p>Dashboard Column Widths</p>
    <div class="slider"></div>
</div>

Javasript

<script src="/js/app.js?id=39da4981c98cf5e6da4f"></script><!-- Contains Jquery and Vue -->
<script src="/assets/plugins/jquery-ui-1.12.1/jquery-ui.min.js"></script>
<script src="/assets/plugins/jquery-ui-slider-pips/jquery-ui-slider-pips.js"></script>
<script>
    $(".slider").slider({ 
        min: 0, 
        max: 6, 
        value: 4
    })
    .slider("pips", {
        rest: "label",
        labels: dashboard_layout_labels
    });
</script>

和CSS

<link rel="stylesheet" href="/assets/plugins/jquery-ui-slider-pips/jquery-ui-slider-pips.css">

0 个答案:

没有答案