vue 自定义键盘组件_vue 自定义 数字键盘+mint UI MessageBox的应用

功能：

实现自定义数字键盘，输入数字超过两位时不可输入

点击清空清空输入框内的值

提交时弹出提示框，并显示所输入的数字用--mint UI实现

效果图：

9.

//将变量numberval赋给value属性 ":"==v-bind

7

8

9

4

5

6

1

2

3

0

提交

清空

JS部分:

.number{ //css使用less编写 比较简单

position:fixed;

bottom: 0;

font-size: 19px;

width: 100%;

.in-number{

font-size: 20px;

width: 100%;

padding: 15px;

text-align: center;

background: #d0cece;

input{

width: 50px;

border: 0px;

// height: 22px;

font-size:19px;

}

}

.numbutton{

margin: auto;

padding: auto;

text-align: center;

li{