Vue2.7组合式中使用this

介绍

这是一个非常不合理的需求，请谨慎观看。。

能在setup的作用域下，在函数内容使用this

使用

main.js中引入

import './setThis'

使用this()方法

<script setup>

const toMainPage = function () {
    this.$router.push('/main')
}.this()
</script>

<template>
    <div>
        <button @click="toMainPage">跳转</button>
    </div>
</template>

这个函数不能是箭头函数，因为这种方法采用修改this指向实现

关于vue2.7组合式中使用router@3的功能，第二个方法：查看

setThis.js

import { getCurrentInstance } from 'vue';

Function.prototype.this = function () {
    return this.bind(getCurrentInstance().proxy)
}

就是为函数原型添加了一个this方法，内容就是通过使用bind改变this指向后返回新的函数

更多问题

就是关于getCurrentInstance的使用性，详见：查看