Ant Design Vue Slider afterChange 拖动后鼠标松开后的事件。
事件名称 | 参数 | 说明 |
---|---|---|
afterChange | Function(value) | 拖动后鼠标松开后的事件 |
<template>
<div>
<a-slider @afterChange="afterChange"/>
</div>
</template>
<script>
export default {
data() {
return {
disabled: false,
};
},
methods: {
//afterChange事件
afterChange(value){
alert(value);
}
},
};
</script>
copy
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Ant Design Vue slider afterChange事件例子</title> <script src="https://www.itxst.com/package/vue/vue.min.js"></script> <script src="https://www.itxst.com/package/ant-design-vue/antd.min.js"></script> <!--浏览器方式下有些事件无法响应,需要引入vue-dash-event插件--> <script src="https://www.itxst.com/package/ant-design-vue/vue-dash-event.js"></script> <link href="https://www.itxst.com/package/ant-design-vue/antd.min.css?aaa" rel="stylesheet" /> <style> body { padding: 10px } </style> </head> <body> <div id="app"> <a-slider @after-change="afterChange"></a-slider> </div> <script> Vue.use(window['vue-dash-event']); var app = new Vue({ el: '#app', data() { return { disabled: false, }; }, methods: { afterChange(value){ alert(value); } }, }); </script> </body> </html>
copy