<template>
<view
class="container" :style="{'padding-bottom': ${52+inputBottom}px
}">
<view class="intro">本项目已包含uni ui组件,无需import和注册,可直接使用。在代码区键入字母u,即可通过代码助手列出所有可用组件。光标置于组件名称处按F1,即可查看组件文档。</view>
<text class="intro">详见:</text>
<uni-link :href="href" :text="href"></uni-link>
<uni-forms border>
<uni-forms-item label="1">
<input :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="年龄">
<input always-system :adjust-position="false" placeholder="请输入年龄"></input>
</uni-forms-item>
<uni-forms-item label="2">
<input type="textarea" :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="3">
<input :adjust-position="false" placeholder="请输入年龄"></input>
</uni-forms-item>
<uni-forms-item label="4">
<input :cursor-spacing="50" :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="5">
<input :cursor-spacing="50" :adjust-position="false" placeholder="请输入年龄"></input>
</uni-forms-item>
<uni-forms-item label="6">
<input :cursor-spacing="50" :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="7">
<input :adjust-position="false" :cursor-spacing="50" placeholder="请输入年龄"></input>
</uni-forms-item> <uni-forms-item label="姓名">
<input :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="8">
<input :adjust-position="false" placeholder="请输入年龄"></input>
</uni-forms-item> <uni-forms-item label="姓名">
<input :adjust-position="false" placeholder="请输入姓名"></input>
</uni-forms-item>
<uni-forms-item label="9">
<input :adjust-position="false" placeholder="请输入年龄"></input>
</uni-forms-item>
</uni-forms>
<view :style="{'margin-bottom': ${inputBottom}px
}" style="display:flex;position: fixed;bottom:0;width: 100%;margin-left: -20px;">
<button style="flex:1;" class="default" @click="goto('/pages/about/about')">保存</button>
<button style="flex:1;" type="default" @click="goto('/pages/about/about')">记录</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
key: '',
inputBottom:'0'
}
},
methods:{
focus(){
return plus.key.setAssistantType('nick')
}
},
beforeCreate(){
uni.onKeyboardHeightChange(res => {
console.log(res.height)
this.inputBottom = res.height
})
},
beforeDestroy(){
uni.offKeyboardHeightChange()
}
}
</script>
<style>
.container {
padding: 20px;
font-size: 14px;
line-height: 24px;
}
</style>
0 个回复