#

whycq

2023-09-25 c814bf32e899265776cd1e66d611dba02dcaf552

#

 components/z-input/z-input.vue

@@ -4,7 +4,7 @@
            <view class="inner1">{{desc}}</view>
            <view class="put inner2">
                <input class="p-input" type="text" :placeholder="placeholder" @input="input" v-model="val">
                <uni-icons class="p-icon" type="closeempty" size="16" color="#707070" v-if="val.length" @click="clear"></uni-icons>
                <uni-icons class="p-icon" type="closeempty" size="16" color="#707070" v-show="val.length" @click="clear"></uni-icons>
            </view>
            <view class="inner3" v-show="btn">
                <button class="m-btn" size="mini">{{btnName}}</button>
@@ -34,13 +34,17 @@
                default: '请输入'
            },
            value: {
                type: [String, Number],
                type: String,
                default: ''
            },
            lenCheck: {
                type: [Number],
                default: null
            },
        },
        watch: {
            value(val) {
                console.log(val);
                console.log(1);
                this.val = val
            },
        },
@@ -54,6 +58,10 @@
        },
        methods: {
            input() {
                console.log(3);
                if(this.val.length != this.lenCheck) {
                    this.val = ''
                }
                this.$emit('input',this.val);
            },
            clear() {

 pages/component/demo.vue

@@ -1,6 +1,6 @@
<template>
    <view>
        <z-input v-for="it in zInputList" :desc="it.desc" :btn="it.btn" :btn-name="it.btnName" v-model="it.val"></z-input>
        <z-input v-for="it in zInputList" :desc="it.desc" :btn="it.btn" :btn-name="it.btnName" v-model="it.val" :lenCheck="it.lenCheck"></z-input>
        <view>输入框1</view>
        <view>{{zInputList[0].val}}</view>
        <view>输入框2</view>
@@ -13,8 +13,8 @@
        data() {
            return {
                zInputList: [ 
                    {name: 'yyy',desc: '托盘码',val: 'a'},
                    {name: 'yyy',desc: '物料码',btn: true,btnName: '提取',placeholder: '',val: 8}
                    {name: 'yyy',desc: '托盘码',val: '2',lenCheck: 8},
                    {name: 'yyy',desc: '物料码',btn: true,btnName: '提取',placeholder: '',val: '1'}
                ],
                
            }