mirror of
https://gitee.com/ant-design-vue/ant-design-vue.git
synced 2024-12-01 19:48:38 +08:00
add vc-slider-demo
This commit is contained in:
wangxueliang
parent
12bd8af6fc
commit
1096cae0a6
@ -19,7 +19,7 @@ export default {
|
||||
},
|
||||
render () {
|
||||
const handle = (h, props) => {
|
||||
const { value, dragging, index, refStr, ...restProps } = props
|
||||
const { value, dragging, index, refStr, style, ...restProps } = props
|
||||
const handleProps = {
|
||||
props: {
|
||||
...restProps,
|
||||
@ -29,6 +29,7 @@ export default {
|
||||
refStr,
|
||||
},
|
||||
key: index,
|
||||
style,
|
||||
}
|
||||
return (
|
||||
<Tooltip
|
||||
@ -44,9 +45,8 @@ export default {
|
||||
)
|
||||
}
|
||||
|
||||
const handleRange = (h, { value, dragging, index, disabled, ...restProps }) => {
|
||||
const handleRange = (h, { value, dragging, index, disabled, style, ...restProps }) => {
|
||||
const tipFormatter = value => `${value}%`
|
||||
const handleStyle = [{}]
|
||||
const tipProps = {}
|
||||
|
||||
const {
|
||||
@ -57,10 +57,10 @@ export default {
|
||||
...restTooltipProps } = tipProps
|
||||
|
||||
let handleStyleWithIndex
|
||||
if (Array.isArray(handleStyle)) {
|
||||
handleStyleWithIndex = handleStyle[index] || handleStyle[0]
|
||||
if (Array.isArray(style)) {
|
||||
handleStyleWithIndex = style[index] || style[0]
|
||||
} else {
|
||||
handleStyleWithIndex = handleStyle
|
||||
handleStyleWithIndex = style
|
||||
}
|
||||
|
||||
const tooltipProps = {
|
||||
|
||||
56
components/vc-slider/demo/marks.jsx
Normal file
56
components/vc-slider/demo/marks.jsx
Normal file
@ -0,0 +1,56 @@
|
||||
import Slider from '../index'
|
||||
import '../assets/index.less'
|
||||
|
||||
export default {
|
||||
render () {
|
||||
const style = { width: '400px', margin: '50px' }
|
||||
const pStyle = { margin: '20px 0' }
|
||||
const marks = {
|
||||
'-10': '-10°C',
|
||||
0: <strong>0°C</strong>,
|
||||
26: '26°C',
|
||||
37: '37°C',
|
||||
50: '50°C',
|
||||
100: {
|
||||
style: {
|
||||
color: 'red',
|
||||
},
|
||||
label: <strong>100°C</strong>,
|
||||
},
|
||||
}
|
||||
|
||||
function log (value) {
|
||||
console.log(value); //eslint-disable-line
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks, `step=null`</p>
|
||||
<Slider min={-10} marks={marks} step={null} onChange={log} defaultValue={20} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks and steps</p>
|
||||
<Slider dots min={-10} marks={marks} step={10} onChange={log} defaultValue={20} />
|
||||
</div>
|
||||
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks, `included=false`</p>
|
||||
<Slider min={-10} marks={marks} included={false} defaultValue={20} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks and steps, `included=false`</p>
|
||||
<Slider min={-10} marks={marks} step={10} included={false} defaultValue={20} />
|
||||
</div>
|
||||
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range with marks</p>
|
||||
<Slider.Range min={-10} marks={marks} onChange={log} defaultValue={[20, 25, 30, 40]} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range with marks and steps</p>
|
||||
<Slider.Range min={-10} marks={marks} step={10} onChange={log} defaultValue={[20, 40]} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
209
components/vc-slider/demo/range.jsx
Normal file
209
components/vc-slider/demo/range.jsx
Normal file
@ -0,0 +1,209 @@
|
||||
import Slider from '../index'
|
||||
import '../assets/index.less'
|
||||
const { Range } = Slider
|
||||
function log (value) {
|
||||
console.log(value); //eslint-disable-line
|
||||
}
|
||||
|
||||
const CustomizedRange = {
|
||||
data () {
|
||||
return {
|
||||
lowerBound: 20,
|
||||
upperBound: 40,
|
||||
value: [20, 40],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onLowerBoundChange (e) {
|
||||
this.lowerBound = +e.target.value
|
||||
},
|
||||
onUpperBoundChange (e) {
|
||||
this.upperBound = +e.target.value
|
||||
},
|
||||
onSliderChange (value) {
|
||||
log(value)
|
||||
this.value = value
|
||||
},
|
||||
handleApply () {
|
||||
this.value = [this.lowerBound, this.upperBound]
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<label>LowerBound: </label>
|
||||
<input type='number' value={this.lowerBound} onChange={this.onLowerBoundChange} />
|
||||
<br />
|
||||
<label>UpperBound: </label>
|
||||
<input type='number' value={this.upperBound} onChange={this.onUpperBoundChange} />
|
||||
<br />
|
||||
<button onClick={this.handleApply}>Apply</button>
|
||||
<br /><br />
|
||||
<Range allowCross={false} value={this.value} onChange={this.onSliderChange} />
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
|
||||
const DynamicBounds = {
|
||||
data () {
|
||||
return {
|
||||
min: 0,
|
||||
max: 100,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSliderChange (value) {
|
||||
log(value)
|
||||
},
|
||||
onMinChange (e) {
|
||||
this.min = +e.target.value || 0
|
||||
},
|
||||
onMaxChange (e) {
|
||||
this.max = +e.target.value || 100
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<label>Min: </label>
|
||||
<input type='number' value={this.min} onInput={this.onMinChange} />
|
||||
<br />
|
||||
<label>Max: </label>
|
||||
<input type='number' value={this.max} onInput={this.onMaxChange} />
|
||||
<br /><br />
|
||||
<Range defaultValue={[20, 50]} min={this.min} max={this.max}
|
||||
onChange={this.onSliderChange}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
|
||||
const ControlledRange = {
|
||||
data () {
|
||||
return {
|
||||
value: [20, 40, 60, 80],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange (value) {
|
||||
this.value = value
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return <Range value={this.value} onChange={this.handleChange} />
|
||||
},
|
||||
}
|
||||
|
||||
const ControlledRangeDisableAcross = {
|
||||
props: {
|
||||
pushable: [Number, Boolean],
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
value: [20, 40, 60, 80],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange (value) {
|
||||
this.value = value
|
||||
},
|
||||
},
|
||||
render () {
|
||||
const rangeRange = {
|
||||
props: {
|
||||
value: this.value,
|
||||
allowCross: false,
|
||||
...this.$props,
|
||||
},
|
||||
on: {
|
||||
change: this.handleChange,
|
||||
},
|
||||
}
|
||||
return <Range
|
||||
{...rangeRange}
|
||||
/>
|
||||
},
|
||||
}
|
||||
|
||||
const PureRenderRange = {
|
||||
data () {
|
||||
return {
|
||||
foo: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange (value) {
|
||||
console.log(value)
|
||||
this.foo = !this.foo
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return <Range defaultValue={[20, 40, 60, 80]} onChange={this.handleChange} allowCross={false} />
|
||||
},
|
||||
}
|
||||
|
||||
export default {
|
||||
render () {
|
||||
const style = { width: '400px', margin: '50px' }
|
||||
const pStyle = { margin: '20px 0' }
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Range，`allowCross=false`</p>
|
||||
<Range allowCross={false} defaultValue={[0, 20]} onChange={log} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Range，`step=20` </p>
|
||||
<Range step={20} defaultValue={[20, 20]} onBeforeChange={log} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Range，`step=20, dots` </p>
|
||||
<Range dots step={20} defaultValue={[20, 40]} onAfterChange={log} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Range，disabled</p>
|
||||
<Range allowCross={false} defaultValue={[0, 20]} onChange={log} disabled />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Controlled Range</p>
|
||||
<ControlledRange />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Controlled Range, not allow across</p>
|
||||
<ControlledRangeDisableAcross />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Controlled Range, not allow across, pushable=5</p>
|
||||
<ControlledRangeDisableAcross pushable={5} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Multi Range</p>
|
||||
<Range count={3} defaultValue={[20, 40, 60, 80]} pushable />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Multi Range with custom track and handle style</p>
|
||||
<Range count={3} defaultValue={[20, 40, 60, 80]} pushable
|
||||
trackStyle={[{ backgroundColor: 'red' }, { backgroundColor: 'green' }]}
|
||||
handleStyle={[{ backgroundColor: 'yellow' }, { backgroundColor: 'gray' }]}
|
||||
railStyle={{ backgroundColor: 'black' }}
|
||||
/>
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Customized Range</p>
|
||||
<CustomizedRange />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range with dynamic `max` `min`</p>
|
||||
<DynamicBounds />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range as child component</p>
|
||||
<PureRenderRange />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
223
components/vc-slider/demo/slider.jsx
Normal file
223
components/vc-slider/demo/slider.jsx
Normal file
@ -0,0 +1,223 @@
|
||||
import Slider from '../index'
|
||||
import Tooltip from '../../vc-tooltip'
|
||||
import '../assets/index.less'
|
||||
import '../../vc-tooltip/assets/bootstrap.less'
|
||||
|
||||
const { Handle } = Slider
|
||||
|
||||
function log (value) {
|
||||
console.log(value); //eslint-disable-line
|
||||
}
|
||||
|
||||
const CustomizedSlider = {
|
||||
data () {
|
||||
return {
|
||||
value: 50,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSliderChange (value) {
|
||||
log(value)
|
||||
this.value = value
|
||||
},
|
||||
onAfterChange (value) {
|
||||
log(value)
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return <Slider value={this.value}
|
||||
onChange={this.onSliderChange} onAfterChange={this.onAfterChange}
|
||||
/>
|
||||
},
|
||||
}
|
||||
|
||||
const DynamicBounds = {
|
||||
data () {
|
||||
return {
|
||||
min: 0,
|
||||
max: 100,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSliderChange (value) {
|
||||
log(value)
|
||||
this.value = value
|
||||
},
|
||||
onAfterChange (value) {
|
||||
log(value)
|
||||
},
|
||||
onMinChange (e) {
|
||||
this.min = +e.target.value || 0
|
||||
},
|
||||
onMaxChange (e) {
|
||||
this.max = +e.target.value || 100
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<label>Min: </label>
|
||||
<input type='number' value={this.min} onInput={this.onMinChange} />
|
||||
<br />
|
||||
<label>Max: </label>
|
||||
<input type='number' value={this.max} onInput={this.onMaxChange} />
|
||||
<br /><br />
|
||||
<Slider defaultValue={50} min={this.min} max={this.max}
|
||||
onChange={this.onSliderChange}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
|
||||
const SliderWithTooltip = {
|
||||
data () {
|
||||
return {
|
||||
visibles: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleTooltipVisibleChange (index, visible) {
|
||||
this.visibles[index] = visible
|
||||
this.visibles = { ...this.visibles }
|
||||
},
|
||||
handleRange (h, { value, dragging, index, disabled, style, ...restProps }) {
|
||||
const tipFormatter = value => `${value}%`
|
||||
const tipProps = { overlayClassName: 'foo' }
|
||||
|
||||
const {
|
||||
prefixCls = 'rc-slider-tooltip',
|
||||
overlay = tipFormatter(value),
|
||||
placement = 'top',
|
||||
visible = visible || false,
|
||||
...restTooltipProps } = tipProps
|
||||
|
||||
let handleStyleWithIndex
|
||||
if (Array.isArray(style)) {
|
||||
handleStyleWithIndex = style[index] || style[0]
|
||||
} else {
|
||||
handleStyleWithIndex = style
|
||||
}
|
||||
|
||||
const tooltipProps = {
|
||||
props: {
|
||||
prefixCls,
|
||||
overlay,
|
||||
placement,
|
||||
visible: (!disabled && (this.visibles[index] || dragging)) || visible,
|
||||
...restTooltipProps,
|
||||
},
|
||||
key: index,
|
||||
}
|
||||
const handleProps = {
|
||||
props: {
|
||||
value,
|
||||
...restProps,
|
||||
},
|
||||
on: {
|
||||
mouseenter: () => this.handleTooltipVisibleChange(index, true),
|
||||
mouseleave: () => this.handleTooltipVisibleChange(index, false),
|
||||
change: log,
|
||||
},
|
||||
style: {
|
||||
...handleStyleWithIndex,
|
||||
},
|
||||
}
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
{...tooltipProps}
|
||||
>
|
||||
|
||||
<Handle
|
||||
{...handleProps}
|
||||
/>
|
||||
</Tooltip>
|
||||
)
|
||||
},
|
||||
},
|
||||
render () {
|
||||
return <Slider handle={this.handleRange} />
|
||||
},
|
||||
}
|
||||
|
||||
export default {
|
||||
render () {
|
||||
const style = { width: '400px', margin: '50px' }
|
||||
const pStyle = { margin: '20px 0' }
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Slider</p>
|
||||
<Slider onChange={log} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Slider，`step=20`</p>
|
||||
<Slider step={20} defaultValue={50} onBeforeChange={log} />
|
||||
</div>
|
||||
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Slider，`step=20, dots`</p>
|
||||
<Slider dots step={20} defaultValue={100} onAfterChange={log} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Slider，`step=20, dots, dotStyle={"{borderColor: 'orange'}"}, activeDotStyle={"{borderColor: 'yellow'}"}`</p>
|
||||
<Slider dots step={20} defaultValue={100} onAfterChange={log} dotStyle={{ borderColor: 'orange' }} activeDotStyle={{ borderColor: 'yellow' }} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with tooltip, with custom `tipFormatter`</p>
|
||||
<SliderWithTooltip />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with custom handle and track style.<strong>(old api, will be deprecated)</strong></p>
|
||||
<Slider
|
||||
defaultValue={30}
|
||||
maximumTrackStyle={{ backgroundColor: 'red', height: '10px' }}
|
||||
minimumTrackStyle={{ backgroundColor: 'blue', height: '10px' }}
|
||||
handleStyle={{
|
||||
borderColor: 'blue',
|
||||
height: '28px',
|
||||
width: '28px',
|
||||
marginLeft: '-14px',
|
||||
marginTop: '-9px',
|
||||
backgroundColor: 'black',
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with custom handle and track style.<strong>(The recommended new api)</strong></p>
|
||||
<Slider
|
||||
defaultValue={30}
|
||||
trackStyle={{ backgroundColor: 'blue', height: '10px' }}
|
||||
handleStyle={{
|
||||
borderColor: 'blue',
|
||||
height: '28px',
|
||||
width: '28px',
|
||||
marginLeft: '-14px',
|
||||
marginTop: '-9px',
|
||||
backgroundColor: 'black',
|
||||
}}
|
||||
railStyle={{ backgroundColor: 'red', height: '10px' }}
|
||||
/>
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Basic Slider, disabled</p>
|
||||
<Slider onChange={log} disabled />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Controlled Slider</p>
|
||||
<Slider value={50} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Customized Slider</p>
|
||||
<CustomizedSlider />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with dynamic `min` `max`</p>
|
||||
<DynamicBounds />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
57
components/vc-slider/demo/vertical.jsx
Normal file
57
components/vc-slider/demo/vertical.jsx
Normal file
@ -0,0 +1,57 @@
|
||||
import Slider from '../index'
|
||||
import '../assets/index.less'
|
||||
|
||||
export default {
|
||||
render () {
|
||||
const style = { float: 'left', width: '160px', height: '400px', marginBottom: '160px', marginLeft: '50px' }
|
||||
const parentStyle = { overflow: 'hidden' }
|
||||
const pStyle = { margin: '20px 0' }
|
||||
const marks = {
|
||||
'-10': '-10°C',
|
||||
0: <strong>0°C</strong>,
|
||||
26: '26°C',
|
||||
37: '37°C',
|
||||
50: '50°C',
|
||||
100: {
|
||||
style: {
|
||||
color: 'red',
|
||||
},
|
||||
label: <strong>100°C</strong>,
|
||||
},
|
||||
}
|
||||
|
||||
function log (value) {
|
||||
console.log(value); //eslint-disable-line
|
||||
}
|
||||
return (
|
||||
<div style={parentStyle}>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks, `step=null`</p>
|
||||
<Slider vertical min={-10} marks={marks} step={null} onChange={log} defaultValue={20} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks and steps</p>
|
||||
<Slider vertical dots min={-10} marks={marks} step={10} onChange={log} defaultValue={20} />
|
||||
</div>
|
||||
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks, `included=false`</p>
|
||||
<Slider vertical min={-10} marks={marks} included={false} defaultValue={20} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Slider with marks and steps, `included=false`</p>
|
||||
<Slider vertical min={-10} marks={marks} step={10} included={false} defaultValue={20} />
|
||||
</div>
|
||||
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range with marks</p>
|
||||
<Slider.Range vertical min={-10} marks={marks} onChange={log} defaultValue={[20, 25, 30, 40]} />
|
||||
</div>
|
||||
<div style={style}>
|
||||
<p style={pStyle}>Range with marks and steps</p>
|
||||
<Slider.Range vertical min={-10} marks={marks} step={10} onChange={log} defaultValue={[20, 40]} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
}
|
||||
@ -102,7 +102,6 @@ export default {
|
||||
refStr,
|
||||
...ariaProps,
|
||||
},
|
||||
style: elStyle,
|
||||
class: className,
|
||||
on: {
|
||||
blur: this.onBlur,
|
||||
@ -115,6 +114,7 @@ export default {
|
||||
return (
|
||||
<div
|
||||
{...handleProps}
|
||||
style={elStyle}
|
||||
/>
|
||||
)
|
||||
},
|
||||
|
||||
@ -86,8 +86,8 @@ const Range = {
|
||||
const isNotControlled = !hasProp(this, 'value')
|
||||
if (isNotControlled) {
|
||||
this.setState(state)
|
||||
} else if (state.handle !== undefined) {
|
||||
this.setState({ sHandle: state.handle })
|
||||
} else if (state.sHandle !== undefined) {
|
||||
this.setState({ sHandle: state.sHandle })
|
||||
}
|
||||
|
||||
const data = { ...this.$data, ...state }
|
||||
@ -110,10 +110,9 @@ const Range = {
|
||||
|
||||
const prevValue = bounds[this.prevMovedHandleIndex]
|
||||
if (value === prevValue) return
|
||||
|
||||
const nextBounds = [...bounds]
|
||||
nextBounds[this.prevMovedHandleIndex] = value
|
||||
this.$emit('change', { bounds: nextBounds })
|
||||
this.onChange({ bounds: nextBounds })
|
||||
},
|
||||
onEnd () {
|
||||
this.setState({ sHandle: null })
|
||||
|
||||
@ -43,7 +43,7 @@ export default function createSlider (Component) {
|
||||
max: 100,
|
||||
step: 1,
|
||||
marks: {},
|
||||
handle (h, { index, refStr, className, ...restProps }) {
|
||||
handle (h, { index, refStr, className, style, ...restProps }) {
|
||||
delete restProps.dragging
|
||||
const handleProps = {
|
||||
props: {
|
||||
@ -53,6 +53,7 @@ export default function createSlider (Component) {
|
||||
refStr,
|
||||
},
|
||||
class: className,
|
||||
style,
|
||||
key: index,
|
||||
}
|
||||
return <Handle {...handleProps} />
|
||||
@ -67,6 +68,10 @@ export default function createSlider (Component) {
|
||||
dotStyle: {},
|
||||
activeDotStyle: {},
|
||||
}),
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'change',
|
||||
},
|
||||
data () {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
const { step, max, min } = this
|
||||
@ -147,6 +152,7 @@ export default function createSlider (Component) {
|
||||
}
|
||||
},
|
||||
onBlur (e) {
|
||||
console.dir(e)
|
||||
this.onEnd(e)
|
||||
this.$emit('blur', e)
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user