Vue render 函数中使用this

1.在render中直接使用this,on里面click函数不是箭头函数

使用this需要在父级将this保存起来才能使用

render: (h, params) => {
            const { row } = params
            let _this = this
            return h('div', {
              class: {
                picture: true
              },
              style: {
                backgroundImage: `url(${row.picture})`
              },
              on: {
                click () {
                  if (!row.picture) {
                    return
                  }
                  _this.previewUrl = row.picture
                  _this.showPreview = true
                }
              }
            })
}

2.在render的click函数中使用箭头函数可以直接使用this访问vue实例

render: (h, params) => {
            const { row } = params
            return h('div', {
              class: {
                picture: true
              },
              style: {
                backgroundImage: `url(${row.picture})`
              },
              on: {
                click: () => {
                  if (!row.picture) {
                    return
                  }
                  this.previewUrl = row.picture
                  this.showPreview = true
                }
              }
            })
          }