naive-ui/demo/documentation/components/input/enUS/pair.md

762 B
Raw Blame History

Pairwise Value

<n-input
  pair
  seperator="-"
  v-model="value"
  :placeholder="placeholder"
  clearable
  @blur="handleInputBlur"
  @focus="handleInputFocus"
  @change="handleInputChange"
  @input="handleInputInput"
/>
export default {
  data () {
    return {
      placeholder: ['From', 'To'],
      value: ['0', '100']
    }
  },
  methods: {
    handleInputBlur () {
      this.$NMessage.info('Pairwise ValueBlur')
    },
    handleInputFocus () {
      this.$NMessage.info('Pairwise ValueFocus')
    },
    handleInputInput () {
      this.$NMessage.info('Pairwise ValueInput')
    },
    handleInputChange () {
      this.$NMessage.info('Pairwise ValueChange')
    }
  }
}
.n-input {
  margin-bottom: 8px;
}