写网页的时候想要添加一个输入数字的地方,如图所示。
在框内想要有汉字提示来指示这个框输入什么,那么仍然使用input来写,html代码如下:
<input
v-model="activityParam.basePrice"
type="number"
placeholder="最低价">
v-model
用来获取输入的数值。适当CSS调整样式可以获得不同样式的输入框。
接下来由于我们的输入框是用来输入最低价格的,那么价格不能为负,我们设置最低价格必须要大于0,如果用户输入一个小于等于0的数则activityParam.basePrice
仍为空。
有了这个要求我们需要加一个监控,来观察用户输入了什么,JS代码如下。
watch:{
'activityParam.basePrice':function(newValue){
activityParam.basePrice = newValue >= 1 ? newValue : '';
}
}
这样就可以使得输入必须大于等于1了。