vue3.0 getCurrentInstance访问内部组件实例

getCurrentInstance支持访问内部组件实例,用于高阶用法或库的开发。

使用:
	  setup() {
	    const internalInstance = getCurrentInstance()
	
	    internalInstance.appContext.config.globalProperties; 访问全局变量globalProperties
	    getCurrentInstance().uid;	访问组件的id
	  }

在setup或生命周期钩子外使用,先在setup中调用getCurrentInstance()获取该实例然后再使用。
	
	const MyComponent = {
	  setup() {
	    const internalInstance = getCurrentInstance() 成功
	
	    const id = useComponentId() 成功
	
	    const handleClick = () => {
		  getCurrentInstance()  获取失败
	      useComponentId()      获取失败
	
	      internalInstance  成功
	    }
	
	    onMounted(() => {
	      getCurrentInstance()  成功
	    })
	
	    return () =>
	      h(
	        'button',
	        {
	          onClick: handleClick
	        },
	        `uid: ${id}`
	      )
	  }
	}
	
   在组合式函数中调用也可以正常执行
	function useComponentId() {
	  return getCurrentInstance().uid
	}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值