小记--写给自己看

最近在做一个商城类的项目，各种的数据正则炸天，有些东西忘了，在这做个小的记录

1.数字的验证-----> 比如说商品数量，不能小于 0 ，而且一定得是数字 ，不能为空字符

 一定是数字，说明字符都得在0-9之间 可以这么写正则 /[^0-9]/g  -->它会去找非数字的东东
但是有个问题，那就是空字符上面的没办法找，所以要单独去验证数据是不是空字符 ，然后再来个逻辑 || OK

如果每种情况都单独去判断，就问题复杂化了。 第二种方式就是 自定义键盘组件 ，这个咱就不讲了。 

 

2.使用有赞的键盘组件-个人感觉的正确方式

首先最简单的一点就是去vant官网把键盘组件给copy下来

<van-number-keyboard
:show="showJian"
extra-key="."
close-button-text="完成"
@blur="showJian = false"
@input="onInput"
@delete="onDelete"
/>

　　

  这个都是简单的，关键是怎么把手机自带的键盘给隐藏掉。

要做以下两点

1.给input元素设置readonly属性，设置只读。2.写这么一段js document.activeElement.blur() 这样才真正意义上的hide掉手机自带的键盘。当然，根据你的需要可以选择用自带的还是组件的。

但是有这么一个场景，假设你要一次性给多个列表项设置数量，并且这个数量只是这个单元的一个属性，又恰巧你的v-model="单元.属性" -> 那么为了能够同步数据，你需要抓到这个单元，

再给对应的位置再单独设置---------->主要容易没搞清楚的就是，你在组件自带键盘的事件中拿到的数字，是单独分离开来的，和你的input元素没有直接关联关系。 

最简单的理解方式就是v-model是由时事件驱动函数，再去改数据。我们直接去修改dom的值，对vue里面的数据当然不会有变化。所以当然要去修改数据源了

 获取元素的实际高度(包含border+padding)  client的话则只是内容高度+padding 不包含border

 

关于上拉加载我做了一个骨架，随便看看