uni-app props不能传递function的问题

1. 第一种方式，通过子组件 $emit触发，不管嵌套多少层，只要每层子组件都触发$emit，并将传递参数，则父组件总能接受到方法执行的命令，并按照你的需求执行
2. 通过$parent在子组件中拿到父组件的方法，但是注意调用时，需采用call，apply，bind等方式，对方法进行this指定，防止方法中的this指向有误。
   例：

// 父组件
    load (start, offset) {
      return this.$http.post({
        urlKey: 'history',
        params: {
          start,
          offset
        }
      }).then(res => {
        if (res && res.success) {
          return {
            list: res.result || []
          }
        } else {
          return {
            list: []
          }
        }
      })
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// 子组件

toPage (pageIndex, params) {
      this.pageIndex = pageIndex
      this.params = params
      let hander = this.load
      if (!hander) {
        hander = this.$parent.load
      }
      return hander.call(this.$parent, pageIndex, this.pageSize, params).then(({ list }) => {
        this.isEmpty = false
        if (this.pageIndex === this.initPageIndex) {
          this.list = []
        }
        if (list.length < this.pageSize) {
          this.finished = true
        }
        if (list.length === 0 && this.pageIndex !== this.initPageIndex) {
          this.finished = true
        } else if (this.pageIndex === this.initPageIndex && list.length === this.pageSize) {
          this.list = list
          this.finished = false
        } else if (this.pageIndex === this.initPageIndex && !list.length) {
          this.isEmpty = true
          this.finished = true
          this.list = list
        } else {
          this.list = this.list.concat(list)
        }
      }).finally(() => {
        this.loading = false
      })
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

冗余描述：

hander = this.$parent.load
hander.call(this.$parent, pageIndex, this.pageSize, params).then(({ list }) => {
1
2

其实call的时候，传递的参数给到hander，参数(pageIndex, this.pageSize, params)是属于当前环境下的，只是将this指向，指了一下父级，在父级能拿到$http这个方法，而单纯hander方法是没有this的，$http就会报错。

此后的then还是继续拿着当前方法的this指向在运作。

另：
Promise().then()既然返回的是一个Promise对象, 那么then()中应该有类似于Promise((resolve, reject)=>{})中的resolve和reject的参数,以便向后传递继续(when resolved)或者中断(when rejected)的信息. 但是, then()中只接受两个函数:handleFulfilled,handleRejected, 并且这两个函数中的参数只有一个, 就是上一个Promise中resolve出来的或reject出来的.

解决方法:
在.then()中使用return和throw
任何不是 throw 的终止都会创建一个"已决议（resolved）"状态，而以 throw 终止则会创建一个"已拒绝"状态。

所以父组件中then后的return，其实相当于在 promise中使用了 resolve或 reject，给到了下一个使用其方法的then的值。

再总结一下：
直接通过hander = this.$parent.load，拿到的hander，是没有this的。
所以call就是让父组件的方法 在子组件中能够顺利执行，入参以及then之后的处理参数，都跟父组件没关系，
所以，如果只针对上述load方法 hander.call(this.$parent，也可以只换成this，毕竟$http是挂全局的
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17