lc-numberfield

货币或数量输入框，集成了显示货币单位，自动格式化功能

效果

使用方法

<template>
  <div class="wxc-demo">
    <title title="lc-numberfield"></title>

    <div class="container">
      <category title="普通输入"></category>
      <div class="form">
        <lc-numberfield type="number"  placeholder="最小金额10元" maxlength=10 ></lc-numberfield>
      </div>

      <category title="显示货币"></category>
      <div class="form">
        <lc-numberfield type="number" :showIcon="true" placeholder="最小金额10元" maxlength=10 v-model="money"></lc-numberfield>
      </div>
    </div>

  </div>
</template>

<style scoped>
  .wxc-demo {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #FFFFFF;
  }
  .container{
    flex-direction: column;
    align-items: center;
  }
  .form{
    width: 600px;
  }
</style>

<script>
  import LcNumberfield from 'lighting-ui/packages/lc-numberfield';
  import Category from 'lighting-ui/packages/_mods/category.vue';
  import Title from 'lighting-ui/packages/_mods/title.vue';

  export default {
    components: { Title, Category, LcNumberfield },
    data: () => ({
      money: 200
    }),
    created () {
    },
    methods: {

    },
    watch:{
      money(newVal, oldVal){
        console.log(newVal, oldVal);
      }
    }
  };
</script>

API

Prop	Type	Required	Default	Description
showIcon	String	N	text	是否显示货币图标
placeholder	String	N		提示文本
maxlength	Number	N		输入最大长度

• *输入非法的数字格式可能会使显示异常或为0，请保证输入正确
• *maxlength建议不要超过12位，否则会导致界面错乱无法清空

事件回调

@onInput="onInput"