当前位置:网站首页>uniapp 除了数字,其他输入无效
uniapp 除了数字,其他输入无效
2022-07-04 23:03:00 【你的美,让我痴迷】
<template>
<view>
<input type="number"class="tl-price-input" placeholder="请输入数字1" v-model="number" >
<input type="number" class="tl-price-input" placeholder="请输入数字2" v-model="data.number" >
</view>
</template>
<script>
export default {
data() {
return {
number:'',
data:{
number:'',
}
};
},
computed:{
newFun(){
console.log(this.data.number,this.number,"数据");
if(!Number(this.number)){
this.number=parseFloat(this.number);
}
if(!Number(this.data.number)){
this.data.number=parseFloat(this.data.number);
}
}
},
onLoad() {
}
}
</script>
<style lang="scss">
/*价格搜索input框*/
input, button {
border: none;
outline: none;
}
.tl-price-input{
margin:10px auto;
width: 80%;
border: 1px solid #ccc;
padding: 7px 0;
background: #F4F4F7;
border-radius: 3px;
padding-left:5px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s
}
.tl-price-input:focus{
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
}
.ant-btn {
line-height: 1.499;
position: relative;
display: inline-block;
font-weight: 400;
white-space: nowrap;
text-align: center;
background-image: none;
border: 1px solid transparent;
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.015);
box-shadow: 0 2px 0 rgba(0,0,0,0.015);
cursor: pointer;
-webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
transition: all .3s cubic-bezier(.645, .045, .355, 1);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: manipulation;
touch-action: manipulation;
height: 32px;
padding: 0 15px;
font-size: 14px;
border-radius: 4px;
color: rgba(0,0,0,0.65);
background-color: #fff;
border-color: #d9d9d9;
}
.ant-btn-primary {
color: #fff;
background-color: #1890ff;
border-color: #1890ff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.045);
box-shadow: 0 2px 0 rgba(0,0,0,0.045);
}
.ant-btn-red {
color: #fff;
background-color: #FF5A44;
border-color: #FF5A44;
text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.045);
box-shadow: 0 2px 0 rgba(0,0,0,0.045);
}
</style>

边栏推荐
- ECCV 2022 | 腾讯优图提出DisCo:拯救小模型在自监督学习中的效果
- mamp下缺少pcntl扩展的解决办法,Fatal error: Call to undefined function pcntl_signal()
- 一次edu证书站的挖掘
- JS 3D explosive fragment image switching JS special effect
- 【taichi】用最少的修改将太极的pbf2d(基于位置的流体模拟)改为pbf3d
- Excel 快捷键-随时补充
- C language to quickly solve the reverse linked list
- Redis introduction complete tutorial: client communication protocol
- Galera cluster of MariaDB - dual active and dual active installation settings
- Redis getting started complete tutorial: publish and subscribe
猜你喜欢

字体设计符号组合多功能微信小程序源码

位运算符讲解
![[binary tree] the maximum difference between a node and its ancestor](/img/b5/1bc3d102754fc44c6a547807ebab94.png)
[binary tree] the maximum difference between a node and its ancestor
![P2181 diagonal and p1030 [noip2001 popularization group] arrange in order](/img/79/36c46421bce08284838f68f11cda29.png)
P2181 diagonal and p1030 [noip2001 popularization group] arrange in order

A complete tutorial for getting started with redis: redis shell

【剑指offer】1-5题

可观测|时序数据降采样在Prometheus实践复盘

A mining of edu certificate station

VIM editor knowledge summary

Redis: redis configuration file related configuration and redis persistence
随机推荐
推荐收藏:跨云数据仓库(data warehouse)环境搭建,这货特别干!
A complete tutorial for getting started with redis: understanding and using APIs
[graph theory] topological sorting
A complete tutorial for getting started with redis: redis shell
云服务器设置ssh密钥登录
A complete tutorial for getting started with redis: transactions and Lua
A complete tutorial for getting started with redis: Pipeline
The difference between debug and release
Qt加法计算器(简单案例)
Analysis of the self increasing and self decreasing of C language function parameters
Qt个人学习总结
Phpcms paid reading function Alipay payment
可观测|时序数据降采样在Prometheus实践复盘
华泰证券低佣金的开户链接安全吗?
Complete tutorial for getting started with redis: bitmaps
QT addition calculator (simple case)
【爬虫】数据提取之xpath
Redis introduction complete tutorial: List explanation
Wechat official account solves the cache problem of entering from the customized menu
ScriptableObject