键盘折叠
This commit is contained in:
1 parent
9dde19289d
commit
0be23710ad
5 files changed
+17
-19
No files matched your search
@@ -1,8 +1,12 @@
|
||||
<template>
|
||||
<view class="bg-[#f5f5f5] px-1 py-2 rounded-4 absolute bottom-0 w-full">
|
||||
<view class="flex mb-2.5" v-for="(row, rowIndex) in keyboardLayout" :key="rowIndex">
|
||||
<view class="bg-[#f5f5f5] px-1 py-2 rounded-4 fixed bottom-0 left-0 right-0 w-full">
|
||||
<view class="flex justify-end">
|
||||
<image v-show="show" class="w-[50rpx] h-[50rpx] mx-2 mb-1" src="@/static/page/折叠.svg" @click="show = !show" />
|
||||
<image v-show="!show" class="w-[50rpx] h-[50rpx] mx-2 mb-1" src="@/static/page/展开.svg" @click="show = !show" />
|
||||
</view>
|
||||
<view v-show="show" class="flex mb-2.5" v-for="(row, rowIndex) in keyboardLayout" :key="rowIndex">
|
||||
<view
|
||||
class="flex-1 h-[60px] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
class="flex-1 h-[80rpx] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
v-for="(key, keyIndex) in row"
|
||||
:key="keyIndex"
|
||||
@click="handleKeyPress(key.toString())"
|
||||
@@ -10,24 +14,24 @@
|
||||
{{ key }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex mb-0">
|
||||
<view v-show="show" class="flex mb-0">
|
||||
<view
|
||||
class="flex-1 h-[60px] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
class="flex-1 h-[80rpx] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
@click="handleKeyPress('.')"
|
||||
>
|
||||
.
|
||||
</view>
|
||||
<view
|
||||
class="flex-auto h-[60px] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
class="flex-auto h-[80rpx] flex items-center justify-center bg-white text-2xl text-[#333] mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
@click="handleKeyPress('0')"
|
||||
>
|
||||
0
|
||||
</view>
|
||||
<view
|
||||
class="flex-1 h-[60px] flex items-center justify-center bg-white mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
class="flex-1 h-[80rpx] flex items-center justify-center bg-white mx-[5px] rounded-lg cursor-pointer select-none active:bg-[#f0f0f0]"
|
||||
@click="handleDelete"
|
||||
>
|
||||
<image class="w-[30px] h-[30px]" src="@/static/page/keyboardDelete.svg" />
|
||||
<image class="w-[30rpx] h-[30rpx]" src="@/static/page/keyboardDelete.svg" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -43,6 +47,7 @@ const keyboardLayout = ref([
|
||||
["4", "5", "6"],
|
||||
["7", "8", "9"],
|
||||
])
|
||||
const show = ref(true)
|
||||
|
||||
// 按下键盘
|
||||
const handleKeyPress = (key) => {
|
||||
|
||||
Reference in new issue
Block a user