vue/no-ref-object-destructure
disallow usages of ref objects that can lead to loss of reactivity
- ⛔ This rule was removed in eslint-plugin-vue v10.0.0 and replaced by vue/no-ref-object-reactivity-loss rule.
📖 Rule Details
This rule reports the destructuring of ref objects causing the value to lose reactivity.
import { ref } from 'vue'
const count = ref(0)
const v1 = count.value /* ✗ BAD */
const { value: v2 } = count /* ✗ BAD */
const v3 = computed(() => count.value /* ✓ GOOD */)
const v4 = fn(count.value) /* ✗ BAD */
const v5 = fn(count) /* ✓ GOOD */
const v6 = computed(() => fn(count.value) /* ✓ GOOD */)
This rule also supports Reactivity Transform, but Reactivity Transform is an experimental feature and may have false positives due to future Vue changes.
See the RFC for more information on Reactivity Transform.
const count = $ref(0)
const v1 = count /* ✗ BAD */
const v2 = $computed(() => count /* ✓ GOOD */)
const v3 = fn(count) /* ✗ BAD */
const v4 = fn($$(count)) /* ✓ GOOD */
const v5 = $computed(() => fn(count) /* ✓ GOOD */)
🔧 Options
Nothing.
🚀 Version
This rule was introduced in eslint-plugin-vue v9.5.0