<template>
  <div>
		<h2>Slider Range</h2>
		<div style="padding:20px">
			<Slider style="width:300px;"
					v-model="value"
					:showTip="true"
					:range="true"
					:rule="[0,'|',25,'|',50,'|',75,'|',100]"></Slider>
			<div style="margin-top:50px">Value: {{value}}</div>
		</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: [20, 60]
    };
  }
};
</script>