Как сделать ввод цифр с заменой их на данные маски без CLI?

@sdaaaaaaaaaaaaa · Регистрация: 16.06.2020

Author24 — интернет-сервис помощи студентам

Например. У меня есть маска MM/YY, которая выводится на экран. Пользователь вводит: 12/20. И маска меняется на: 12/20.

Javascript

var app= new Vue({
    el: '#app',
    data: {
        number: 'MM/YY'
    }
})

HTML5

<html>
    <head>
        <title>Document</title>
    </head>
    <body>
    <div id ="app">
        <label>Month</label>
        <input type="number" v-facade="'##/##'" />
    </div>
    <script src= "https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src= "q.js"></script>
    </body>
</html>

Добавлено через 15 минут
Что-то типо этого, только чтобы в строке для ввода MM/YY не выводилось

HTML5

<html>
    <head>
        <title>Document</title>
    </head>
    <body>
    <div id ="app">
        <p class="text">{{month}}</p>
        <label>Month</label>
        <input type="text" v-model="month" placeholder= "" />
    </div>
    <script src= "https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src= "q.js"></script>
    </body>
</html>

Javascript

var app= new Vue({
    el: '#app',
    data: {
        month: 'MM/YY'
    }
})

Добавлено через 9 минут
Можно сделать выбор из списка, но он тоже не работает

HTML5

<html>
    <head>
        <title>Document</title>
    </head>
    <body>
    <div id ="app">
        <p class="text">{{month}}</p>
        
        <p class="data">Expiration Data</p>
        <nav>
            <transition name="fade" mode="out-in">
                <button v-on:click="show = !show">Month</button>
            </transition>
            <transition name="fade">
                <ul v-if="show">
                    <li v-for="item in items">
                        <button v-on:click="monthclick"> {{ item }} </button>
                    </li>
                </ul>
            </transition>
        </nav>
    </div>
    <script src= "https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src= "1.js"></script>
    </body>
</html>

Javascript

var app= new Vue({
    el: '#app',
    data: {
        items: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
        show: false
    },
    methods: {
        monthclick: function () {
            this.month =this.items;
        },
    }
})

	06.07.2020, 12:47