2020-11-22 直接触发父组件或者子组件的方法 inject和provide cubic-bezier() 函数。贝塞尔曲线的用法 同时设置min-width和max-width与width

1. 如果想直接触发父组件或者子组件的方法

   如果想直接触发父组件或者子组件的方法可以用this.$parent或者this.$children

例如：
父组件：

methods: {
     loadMore() {
         if(this.getRepeatLock) {
             let customListLength = this.customList.length
             this.lastItem = customListLength? this.customList[customListLength - 1]: {}
             this.pageNow++;
             this.getRepeatList()
         }
     }
 }
        

子组件：

this.$parent.loadMore()

2. inject和provide
   文章源地址：https://blog.csdn.net/viewyu12345/article/details/83011618

作用：组件得引入层次过多，我们的子孙组件想要获取祖先组件得资源，那么怎么办呢，总不能一直取父级往上吧，而且这样代码结构容易混乱。这个就是这对选项要干的事情。

• provide：是一个对象，或者是一个返回对象的函数。里面呢就包含要给子孙后代的东西，也就是属性和属性值。

• inject：一个字符串数组，或者是一个对象。属性值可以是一个对象，包含from和default默认值。

举例：在element中有这样的层级：el-form > el-form-item > el-input

首先在祖先组件中：provie表示提供给子训。这样在任何的后代组件中，都可以使用inject选项来接收指定的我们想要添加在这个实例上的属性。

此时我们的子孙想要获取他祖先的属性了。使用inject：

这样也就可以访问了，当做当前vue实例的属性。这样做的好处，相当于给了一个捷径，不用使用$parent一级一级的访问。

3. cubic-bezier() 函数。贝塞尔曲线的用法

贝塞尔曲线曲线由四个点 P0，P1，P2 和 P3 定义。P0 和 P3 是曲线的起点和终点。P0是（0,0）并且表示初始时间和初始状态，P3是（1,1）并且表示最终时间和最终状态。

更加详细的指向：

上述的表达式为cubic-bezier(.59,.4,.25,.93)。可以知道我们四个值的时候的p0和p3是不会变的。(0,0)和(0,1)。那么中间的值就是p1的坐标和p2的坐标。p1(0.59，0.4) p2(0.25,0.93)。级横向为x坐标，纵向为Y坐标

此时坐标为cubic-bezier(.39,-0.25,.28,1.23)。并且注意的是：而其中 X 轴的取值范围是 0 到 1，当取值超出范围时 cubic-bezier 将失效；Y 轴的取值没有规定，当然也不能过大。

有关状态时间变化的参考：https://blog.csdn.net/wjnf012/article/details/78795573

4. 同时设置minwidth和maxwidth与width

• 同时设置max-width和width： 谁的值小显示谁
  

• 同时设置min-width和width：谁的大显示谁
  

• 同时设置这三个：取Math.max(min-width, Math.min(width, max-width))