vue3提供了getCurrentInstance ,通过这个属性,直接使用ctx是错误的,需要找到全局属性globalProperties

import { getCurrentInstance } from 'vue'
const instance = getCurrentInstance()
const _this= instance.appContext.config.globalProperties

这里的_this就相当于vue2里的this

方案2:

const { proxy } = getCurrentInstance()

使用proxy线上也不会出现问题

Vue3中如何使用this的更多相关文章

  1. vue3中使用axios如何去请求数据

    在vue2中一般放在created中,但是在vue3中取消了created生命周期,请求方式有两种 直接在setup中去获取数据 setup(props) { const data = reactiv ...

  2. vue3中watch函数

    watch 监听普通类型 let count = ref(1); const changeCount = () => { count.value+=1 }; watch(count, (newV ...

  3. 端午总结Vue3中computed和watch的使用

    1使用计算属性 computed 实现按钮是否禁用 我们在有些业务场景的时候,需要将按钮禁用. 这个时候,我们需要使用(disabled)属性来实现. disabled的值是true表示禁用.fals ...

  4. vue 3 学习笔记 (七)——vue3 中 computed 新用法

    vue3 中 的 computed 的使用,由于 vue3 兼容 vue2 的选项式API,所以可以直接使用 vue2的写法,这篇文章主要介绍 vue3 中 computed 的新用法,对比 vue2 ...

  5. 在vue3中使用router-link-active遇到的坑

    在使用 router-link-active 设置链接激活时CSS类名时,发现在例如 /member/order 和 /member/order/:id 这两个都包含 /member/order的路由 ...

  6. Vue3中的响应式对象Reactive源码分析

    Vue3中的响应式对象Reactive源码分析 ReactiveEffect.js 中的 trackEffects函数 及 ReactiveEffect类 在Ref随笔中已经介绍,在本文中不做赘述 本 ...

  7. Vue3中插槽(slot)用法汇总

    Vue中的插槽相信使用过Vue的小伙伴或多或少的都用过,但是你是否了解它全部用法呢?本篇文章就为大家带来Vue3中插槽的全部用法来帮助大家查漏补缺. 什么是插槽 简单来说就是子组件中的提供给父组件使用 ...

  8. vue3中defineComponent 的作用

    vue3中,新增了 defineComponent ,它并没有实现任何的逻辑,只是把接收的 Object 直接返回,它的存在是完全让传入的整个对象获得对应的类型,它的存在就是完全为了服务 TypeSc ...

  9. Module Federation 模块联邦 在Vue3中使用Vue2搭建的微服务

    前言: 备注:本文基于对webpack Module Federation有一定了解的情况下 一般情况下使用模块联邦都是会使用相同的版本,如Vue2的组件时在Vue2中使用,但我为什么会在Vue3项目 ...

  10. vue3中$attrs的变化与inheritAttrs的使用

    在vue3中的$attrs的变化 $listeners已被删除合并到$attrs中. $attrs现在包括class和style属性. 也就是说在vue3中$listeners不存在了.vue2中$l ...

随机推荐

  1. Hibernate双向关联导致Java对象转换为JSON字符串时死循环问题的分析与解决方案

    引言: 本文描述了在SSH框架中,多个持久层对象相互引用,从而引发分页查询中,查询所得的持久化对象转换为JSON字符串报错的原因及解决方案 使用EasyUI框架的小伙伴们都知道,在使用datagrid ...

  2. Vue cli之使用Vue-CLI初始化创建前端项目

    1.生成项目目录 使用vue自动化工具可以快速搭建单页应用项目目录. 该工具为现代化的前端开发工作流提供了开箱即用的构建配置.只需几分钟即可创建并启动一个带热重载.保存时静态检查以及可用于生产环境的构 ...

  3. Android 12(S) MultiMedia Learning(一)开篇

    这个系列将会作为自己学习android多媒体的笔记,如果有错误请帮忙指正. 本系列的学习均基于Android 12(S),代码来源:http://aospxref.com/

  4. Java 中 hashCode 和 equals 方法是什么?它们和 == 各有什么区别?

    在 Java 中,hashCode 和 equals 方法都是 Object 类的方法.它们的作用分别如下: hashCode 方法返回对象的哈希码,用于支持基于哈希表的集合,如 HashMap.Ha ...

  5. linux使用过程中遇到的常见问题

    1 xxxx is not in the sudoers file. This incident will be reported. 解决方式:https://www.cnblogs.com/xym4 ...

  6. 自用电脑+外网开放+SSL认证(纯免费)

    背景: 本文的目的主要是为了方便大家测试,不过有条件的情况下没必要学习了.主要是给那些没有服务器,公司也不给ssl认证的开发测试人员的一种方案:就像题目所说的那样. 纯免费,纯免费的话是有学习成本的, ...

  7. C#.NET 国密SM4加密解密 CBC ECB 2种模式

    注意点: 1.加密时,明文转 byte[] 时,不要用 Encoding.Default,一定要指定编码,如:UTF-8. 解密时,解出的 byte[] 转 string 同样要指定相同的编码. 2. ...

  8. 什么是spring框架?

    spring是一个开放源代码的设计层面框架,它解决的是业务逻辑层和其他各层的松耦合问题,是一个分层的javaEE一站式轻量级开源框架

  9. Javascript高级程序设计第四章 | ch4 | 阅读笔记

    变量.作用域与内存 原始值与引用值 什么是字面量形式? let obj = { key1: val1, key2: val2, foo () { } } 这就是字面量形式,手动声明一个对象的属性和方法 ...

  10. 实验四:WinRAR漏洞

    [实验目的] 通过打开rar文件,获取到目标机shell. [知识点] winrar漏洞 [实验原理] 该漏洞是由于WinRAR所使用的一个陈旧的动态链接库UNACEV2.dll所造成的,该动态链接库 ...