mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-24 12:45:18 +08:00
43 lines
774 B
Markdown
43 lines
774 B
Markdown
# Pairwise Value
|
||
```html
|
||
<n-input
|
||
pair
|
||
separator="-"
|
||
v-model="value"
|
||
:placeholder="placeholder"
|
||
clearable
|
||
@blur="handleInputBlur"
|
||
@focus="handleInputFocus"
|
||
@change="handleInputChange"
|
||
@update:modelValue="handleInputInput"
|
||
/>
|
||
```
|
||
```js
|
||
export default {
|
||
data () {
|
||
return {
|
||
placeholder: ['From', 'To'],
|
||
value: ['0', '100']
|
||
}
|
||
},
|
||
methods: {
|
||
handleInputBlur () {
|
||
this.$NMessage.info('Pairwise Value：Blur')
|
||
},
|
||
handleInputFocus () {
|
||
this.$NMessage.info('Pairwise Value：Focus')
|
||
},
|
||
handleInputInput () {
|
||
this.$NMessage.info('Pairwise Value：Input')
|
||
},
|
||
handleInputChange () {
|
||
this.$NMessage.info('Pairwise Value：Change')
|
||
}
|
||
}
|
||
}
|
||
```
|
||
```css
|
||
.n-input {
|
||
margin-bottom: 8px;
|
||
}
|
||
``` |