我们都知道Vue中的v-model可以与input框进行数据双向绑定<template><divclass="home"><inputtype="text"v-model="val"/>{{val}}</div></template><script>exportdefault{name:"Home",data(){return{val:"",};},};</script>这个想必大家都会，就不过多介绍了。我今天要分享的是如何使用v-model与自定义组件数据双向绑定，因为默认的搜索框样式功能都很少，所以我们需要自己封装一个input组件。话不多说，直接进入主题。先跟大家分享一下不用v-model是怎样实现的首先需要新建一个组件，这里使用的是Input.vue，代码如下<template><!--Input.vue--><div><inputtype="text":value="val"@input="change"/></div></template><script>exportdefault{name:"my-input",props:{val:String,},methods:{change(e){letval=e.target.value;this.$emit("change",val);},},};</script>页面代码<template><!--Home.vue--><divclass="home"><Input:val="val"@change="change"/>{{val}}</div></template><script>importInputfrom"@/components/Input";exportdefault{name:"Home",components:{Input,},data(){return{val:"",};},methods:{change(val){this.val=val;},},};</script>这里用到的是子父组件传值。首先把val通过自定义数据传到子组件里，当子组件数据发生变化时，再把数据通过自定义事件传给父组件。v-model在组件上使用也是类似的思路，只不过是Vue帮我们了。自定义组件v-model官网跟我们说了，组件使用v-model使用了自定义数据value和自定义方法input<template><!--Input.vue--><div><inputtype="text":value="value"@input="change"/></div></template><script>exportdefault{name:"my-input",props:{value:String,},methods:{change(e){letval=e.target.value;this.$emit("input",val);},},};</script><template><!--Home.vue--><divclass="home"><Inputv-model="val"/>{{val}}</div></template><script>importInputfrom"@/components/Input";exportdefault{name:"Home",components:{Input,},data(){return{val:"",};},};</script>可以看到Home.vue使用了v-model后精简了很多，只需要一个写v-model把值传过去。Input.vue中把接受值改为value，然后当数据变化时，通过自定义事件input传过去。就可以进行组件数据双向绑定了。

我们在做一些项目的时候经常会遇到这样一个问题————获取某个月的天数废话不多说，直接上代码getDay(year,month){letd=newDate(year,month,0);returnd.getDate();}Date的更多介绍在上一篇有讲到，这里是利用了Date参数的特性——自动换算上一篇有讲到，Date的参数月份的取值范围是0-11，这里填写的月份实际上是下一个月，但是我们把日份的值写成0后，(因为日份的取值是从1开始的，所以没有0，那么它就会自动换算到上个月的最后一天)。这样一来，正好是咱们需要求得月份的最后一天，也就是这个月的天数

我们都知道newDate()可以获取当前时间的日期，但是不new一样可以获取当前日期那么问题就来了，new到底有什么用呢？这里就涉及到了参数问题，如果没有参数他俩都是当前时间，可是有参数就不一样了可以看出通过new操作的Date对象是2020年1月1日，而没有new的Date还是当前时间Date对象参数可以有很多种写法，这里就不一一介绍了，这里介绍两种。一种就是上面这种直接写一个确定的年份，后面还可以加时间。如newDate(‘2020-1-112:12:12’)另一种是添加多个参数。如newDate(2020,1,5,12,12,12)后面参数不输入默认为取值最小数注：至少添加两个参数，参数分别是年、月、日、时、分、秒。数值超出自动换算。如2020年13月1日则自动换算撑2021年1月。注：这里的月份取值是0-11，也就是0是1月，获取时间时需要用当前月份减一。Date对象常用方法letd=newDate();letyear=d.getFullYear();//获取年份letmonth=d.getMonth();//获取月份(取值范围为0-11，实际值需要+1)letweek=d.getDay();//获取周几(0-6,0为周日)letday=d.getDate();//获取日lethours=d.getHours();//获取小时letmin=d.getMinutes();//获取分钟lets=d.getSeconds();//获取秒letms=d.getMilliseconds();//获取毫秒lettime=d.getTime();//1970年1月1日0时0分0秒（UTC，即协调世界时）距离该日期对象所代表时间的毫秒数。letobj={d,year,month,week,day,hours,min,s,ms,time,}console.log(obj)

单行文本overflow:hidden;//超出的文本隐藏text-overflow:ellipsis;//显示省略号white-space:nowrap;//文本不换行多行文本overflow:hidden;//超出的文本隐藏text-overflow:ellipsis;//显示省略号display:-webkit-box;//作为弹性伸缩盒子模型显示。-webkit-box-orient:vertical;//设置伸缩盒子的子元素排列方式--从上到下垂直排列-webkit-line-clamp:2;//显示的行数注：如果设置了没作用，可能是您没有加宽度(width)