Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature Request] 请求对EffectScope的支持 #239

Open
s3xysteak opened this issue Jun 20, 2024 · 2 comments
Open

[Feature Request] 请求对EffectScope的支持 #239

s3xysteak opened this issue Jun 20, 2024 · 2 comments
Labels
2.x 2.x

Comments

@s3xysteak
Copy link

s3xysteak commented Jun 20, 2024

需求描述 Feature Description

希望能支持EffectScope以获取广泛的使用场景

vue文档

在Vue3中setup是基于EffectScope的,所以这应该是一个非破坏性更新,但是可以扩展很多使用场景

建议的解决方案 Proposed Solution

大概看了一下vue-request的代码,看起来似乎只需要将onUnmounted替换为onScopeDispose即可

其他信息 Other information

onScopeDispose看起来是vue3特有的概念,vue2没有,因此vue-demi好像也没有这个方法。为了解决这个问题可以写一个函数:

import { isVue3, onUnmounted } from 'vue-demi'

function tryOnScopeDispose(fn) {
  isVue3 ? onScopeDispose(fn) : onUnmounted(fn)
}

作为onUnmounted的替代

@s3xysteak
Copy link
Author

这是其使用场景

Before:

const { data } = useRequest(reqA)

const map = {
  1: () => {
    useRequest(reqB)
  },
  2: () => {
    useRequest(reqC)
  }
}

watch(data, (types) => {
  types.forEach(type => map[type]()) // !这里超出了setup周期!
})

After:

const scope = effectScope()
const { data } = useRequest(reqA)

const map = {
  1: () => {
    useRequest(reqB)
  },
  2: () => {
    useRequest(reqC)
  }
}

watch(data, (types) => {
  scope.run(() => {
    types.forEach(type => map[type]()) // ! GOOD !
  })
})

onUnmounted(() => scope.stop())

@John60676
Copy link
Member

当时2.0是有计划替换成 onScopeDispose 后面基于什么原因导致没替换,我可能还需要再查看一下。如果确认能替换的话,可能会在 2.1 版本上线。

@John60676 John60676 added the 2.x 2.x label Jun 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
2.x 2.x
Projects
None yet
Development

No branches or pull requests

2 participants