Экспорт реактивного свойства напрямую по сравнению с переносом toRef

Я создаю свой магазин Vue 2, используя новый API композиции (https://github.com/vuejs/composition-api). Я хотел бы показать подмножество своего состояния.

Каков правильный подход к поддержанию реактивности со ссылкой на свойство источника?

const state = reactive({
  somethingInternal: '',
  name: ''
})

// is this enough?
export const name = state.name
// or do I need to do this?
export const name = toRef(state, 'name')

javascript vue.js vuejs3 vue-composition-api vue-reactivity
person filur    schedule 04.12.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вы должны использовать toRef для поддержания реактивности.

Это экспортирует только строковый литерал:

export const name = state.name

Но это сохраняет связь с реактивным свойством:

export const name = toRef(state, 'name')

Если вы импортируете state и оба экспорта name в другой модуль, а затем измените state.name, изменение будет отражено в экспорте toRef, но не в литерале.

person Dan    schedule 04.12.2020
comment
Спасибо. Знаете ли вы какой-нибудь синтаксический сахар, который позволяет мне экспортировать его как имя, не определяя для него переменную? Ближайшее, что я могу придумать, - это ...toRefs(state), но это добавило бы все свойства - person filur; 04.12.2020
comment
Пожалуйста. Если я правильно понимаю ваш последующий вопрос Q, вы можете экспортировать какой-либо другой объект, который имеет свойства со значениями toRef: export const obj = { name: toRef(state, 'name') } - person Dan; 04.12.2020
comment
Верно, но мне все еще нужно определить ключ имени, этого я бы не хотел делать вручную, поскольку нет подтверждения того, что он соответствует фактическому имени свойства состояния. - person filur; 04.12.2020
comment
Итак, вам нужно динамическое имя свойства? Да, вы можете сделать это с помощью имен вычисленных свойств: export const obj = { [propName]: toRef(state, propName) }. Никогда не пробовал это с именем экспорта (т.е. без упаковки в obj), но вы можете попробовать. - person Dan; 04.12.2020