Subscribe on changes!

多层嵌套effect时，会多次执行子effect

avatar
jackZmym
Jun 15th 2022

Vue version

3.0

Link to minimal reproduction

https://sfc.vuejs.org/#__DEV__eyJBcHAudnVlIjoiPHNjcmlwdCBzZXR1cD5cbmltcG9ydCB7IHJlZiB9IGZyb20gJ3Z1ZSdcbmltcG9ydCB7XG4gICAgICByZWFjdGl2ZSxcbiAgICAgIGVmZmVjdCxcbiAgICB9IGZyb20gJ3Z1ZSdcbmNvbnN0IG1zZyA9IHJlZignaGVsbG8gd29ybGQnKVxuICAgIFxuIGNvbnN0IG9ic2VydmVkID0gcmVhY3RpdmUoe1xuICAgICAgY291bnQxOiAwLFxuICAgICAgY291bnQyOiAxMCxcbiAgICB9KTtcblxuICAgIGVmZmVjdCgoKSA9PiB7XG4gICAgICBlZmZlY3QoKCkgPT4ge1xuICAgICAgICBvYnNlcnZlZC5jb3VudDI9b2JzZXJ2ZWQuY291bnQyKzJcbiAgICAgICAgY29uc29sZS5sb2coJ2NvdW50MiBpczonLCBvYnNlcnZlZC5jb3VudDIpO1xuICAgICAgfSk7XG4gICAgICBjb25zb2xlLmxvZygnY291bnQxIGlzOicsIG9ic2VydmVkLmNvdW50MSk7XG4gICAgfSk7XG4gICAgb2JzZXJ2ZWQuY291bnQxKytcbiAgICBvYnNlcnZlZC5jb3VudDErK1xuICAgIG9ic2VydmVkLmNvdW50MisrXG48L3NjcmlwdD5cblxuPHRlbXBsYXRlPlxuICA8aDE+e3sgb2JzZXJ2ZWQuY291bnQyIH19PC9oMT5cbiAgPGlucHV0IHYtbW9kZWw9XCJtc2dcIj5cbjwvdGVtcGxhdGU+IiwiaW1wb3J0LW1hcC5qc29uIjoie1xuICBcImltcG9ydHNcIjoge1xuICAgIFwidnVlXCI6IFwiaHR0cHM6Ly9zZmMudnVlanMub3JnL3Z1ZS5ydW50aW1lLmVzbS1icm93c2VyLmpzXCIsXG4gICAgXCJ2dWUvc2VydmVyLXJlbmRlcmVyXCI6IFwiaHR0cHM6Ly9zZmMudnVlanMub3JnL3NlcnZlci1yZW5kZXJlci5lc20tYnJvd3Nlci5qc1wiXG4gIH1cbn0ifQ==

Steps to reproduce

const observed = (window.observed = reactive({ count1: 0, count2: 10, }));

effect(() => { effect(() => { console.log('count2 is:', observed.count2); }); console.log('count1 is:', observed.count1); });

What is expected?

执行 observed.count1++ 后 再执行 observed.count2++ 只打印一次 console.log('count2 is:', observed.count2);

What is actually happening?

多次执行 observed.count1++ 后 ， 再执行 observed.count2++ 会打印多次 console.log('count2 is:', observed.count2);

System Info

No response

Any additional comments?

原函数的effectStack=[] 为栈时的操作，以及dep里面存的Set 根据栈的对应数组里值的存储地址，多次执行外层effect后，会导致不同的activeEffect，此时的dep.has(activeEffect)还是拦截不了的。

avatar
liulinboyi
Jun 15th 2022

The test case should allow nested effects: https://github.com/vuejs/core/blob/8a123ac34fd30fc36ac9e0c252dd345d6d7c7f50/packages/reactivity/__tests__/effect.spec.ts#L605-L636

avatar
yyx990803
Jun 16th 2022

你的用法每次外层 effect 都在创建新的子 effect，当然越来越多...

avatar
jackZmym
Jun 17th 2022 
font{
    line-height: 1.6;
}
ul,ol{
    padding-left: 20px;
    list-style-position: inside;
}



好滴，我的想法有点问题，谢谢尤大。

    
        
    


  

    
                
        
            
                
                        
                            
                        
                        
                            1418556630
                        
                
                    
                        
                                ***@***.***
                        
                    
            
        
    
    





---- 回复的原邮件 ----



  
    
     发件人 
    
    
        Evan ***@***.***>
        
    
  
  
    
     发送日期 
    
    
    2022年06月16日 16:50
    
  
  
    
     收件人 
    
    
     
      
        ***@***.***>
        
      
    
  
  
    
     抄送人 
    
    
      
        ***@***.***>
        ,
      
      
        ***@***.***>
        
      
    
  
  
    
     主题 
    
    
          Re: [vuejs/core] 多层嵌套effect时，会多次执行子effect (Issue #6118)

你的用法每次外层 effect 都在创建新的子 effect，当然越来越多...

—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you authored the thread.Message ID: @.***>

GitHub Track