Subscribe on changes!

the reactive and the shallowReactive shield each other, so code not work as expect

avatar
Feb 6th 2021

Version

3.0.5

Steps to reproduce

import { reactive, shallowReactive, watchEffect } from 'vue'

const a = { name: 'rakiyu', friends: ['friend1'] }

const sa = shallowReactive(a)
const ra = reactive(a)

console.log(sa === ra) // true, the reactive status depending on reactive or shallowReactive which run first, the === will always true

const f = ra.friends

watchEffect(() => {
  console.log(...f)
})

ra.friends.push('friend2') // will not triger console.log

What is expected?

log out friend2

What is actually happening?

not log