@femessage/el-semver-input

Semantic version input component: auto filled when blur.

Usage no npm install needed!

<script type="module">
  import femessageElSemverInput from 'https://cdn.skypack.dev/@femessage/el-semver-input';
</script>

README

el-semver-input

    

Semantic version input component: auto filled when blur.

中文文档

Introduction

What is el-semver-input

el-semver-input component based on el-input. It will valify input value, and the error input can be automatically corrected.

Why

Use el-semver-input You will enjoy the following conveniences:

  • Easy to get started, turn on all functions by default
  • Customizable format validation rules
  • Customizable auto-fill rules

Table of Contents

Feature

  • Optional v prefix
  • Prevent illegal input
  • Can be automatically filled according to default or custom rules
  • Reset illegal value to default value when blur
  • Custom inspection rules, automatically filling rules
  • Try to fix it automatically according to the matching rules

⬆Back to Top

Documentation

⬆Back to Top

Pre Install

# ensure element-ui installed
yarn add element-ui
# and el-input has global registered

Quick Start

# Step1 install
yarn add @femessage/el-semver-input
// Step2 In the required .vue file
<template>
  <el-semver-input v-model="version" />
</template>
<script>
import ElSemverInput from 'el-semver-input'
export default {
  components: {
    ElSemverInput
  },
  data() {
    return {
      version: ''
    }
  }
}
</script>

⬆Back to Top

Example

  • Automatically correct

  • Custom auto fill rule

  • Prevent illegal input

⬆Back to Top

Contributors

Thanks goes to these wonderful people ( Emoji key ):
This project follows All-contributors Specification. Contributions of any kind welcome!

⬆Back to Top