crm-mobile/components/wk-form/wk-field-mobile.vue

<template>
  <view class="wk-field wk-field-input">
    <view v-if="_label" class="wk-field__label">
      <view v-if="field.isNull === 1" class="line" />
      {{ _label }}
    </view>
    <view class="wk-field__body" @click="handleClick">
      <input
        ref="core"
        v-model="formValue"
        type="number"
        :placeholder="_placeholder"
        :maxlength="11"
        :disabled="field.disabled"
        placeholder-class="wk-placeholder placeholder"
        class="wk-field__body-core"
        @input="changeText">
    </view>
  </view>
</template>

<script>
  import mixins from './mixins'
	
  export default {
    name: 'WkFieldMobile',
    mixins: [mixins],
    data() {
      return {}
    },
    methods: {
      handleClick() {
        if (this.field.disabled) {
          if (this.config && this.config.disabledMsg) {
            this.$toast(this.config.disabledMsg)
          }
          return
        }
      },
			
      formatValue(oldStr) {
        let valueStr = String(oldStr)
        return valueStr.replace(/[^0-9]/g, '')
      },
			
      changeText() {
        let oldStr = String(this.formValue)
        let valueStr = this.formatValue(this.formValue)
				
        this.formValue = oldStr
        this.$nextTick(function() {
          this.formValue = valueStr
          if (this.value !== this.formValue) {
            this.emitChangeEvt(this.formValue)
          }
        })
      }
    }
  }
</script>

<style scoped lang="scss">
	@import './wkField.scss';

	.placeholder {
		font-size: 26rpx;
	}
</style>