PDA/uni_modules/tk-input

示例

<template>
    <view class="content">
        <view>
            <tk-input ref="myInput1" class="un-input" :allowEdit="true"
                :style="{border:'1px solid #000', margin: '5px'}" @input="input" v-model="value1"
                @confirm="onInput1Confirm" />
            <view>value1:{{value1}}</view>

            <tk-input ref="myInput2" v-model="value2" class="un-input" :style="{border:'1px solid #000', margin: '5px'}"
                @input="input" @confirm="onInput2Confirm" />
            <view>value2:{{value2}}</view>

        </view>



        <button @click="focus">input1获得焦点</button>
        <button @click="showKeyboard">input1显示键盘</button>
        <button @click="hideKeyboard">input1隐藏键盘</button>
        <button @click="onSetText">input1 onSetText</button>
        <button @click="onReset">input1 onReset</button>

        <button @click="focus1">input2获得焦点1</button>

    </view>
</template>

<script>
    export default {
        data() {
            return {
                title: 'Hello',
                value1: "",
                value2: ''
            }
        },
        onLoad() {
            this.$nextTick(() => {
                this.$refs.myInput1.focus()
            })
        },
        methods: {
            input(e) {
                console.log("e ************: ", e);
            },
            focus() {
                this.$refs.myInput1.focus()
            },
            focus1() {
                this.$refs.myInput2.focus()
            },
            showKeyboard() {
                this.$refs.myInput1.showKeyboard()
            },
            hideKeyboard() {
                this.$refs.myInput1.hideKeyboard()
            },
            onInput1Confirm(val) {
                console.log("val ************: ", val);
                this.$refs.myInput1.focus()
            },
            onInput2Confirm(val) {
                console.log("val ************: ", val);
                this.$refs.myInput1.focus()
            },
            onSetText() {
                this.$refs.myInput1.onSetText('99999');
            },
            onReset() {
                this.$refs.myInput1.onReset();
            }
        }
    }
</script>

<style>
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
</style>