Верно я понимаю что основное практическое назначение toRef во vue

Question

Верно я понимаю что основное практическое назначение toRef во vue

3 - предоставление реактивности для состояния в ответ как на изменение извне (props), так и на изменение изнутри (присваивание через свойство value)?

#programming #russian #vue.js

0

19.07.2023

17 ответов

21 просмотр

Sasha Автор вопроса

Kirill 🍅 Romanov
Нет. Пропсы нельзя менять изнутри

Видимо вы меня не поняли. Я имел в виду что с помощью toRef наверное удобно организовать state внутри компонента который будет меняться как при прямом изменении, так и при изменении свойства, переданного извне компонента. И если я правильно понял, то для этого он и создан?

0

19.07.2023

Denis Chernov

скорее это боксинг для консистентности api

0

19.07.2023

Kirill 🍅 Romanov

Sasha
Видимо вы меня не поняли. Я имел в виду что с помо...

> удобно организовать state внутри компонента который будет меняться как при прямом изменении ну вот тут ты про что?

0

19.07.2023

Sasha Автор вопроса

Kirill 🍅 Romanov
> удобно организовать state внутри компонента кото...

Ну например компонент, внутри которого есть поле ввода. Снаружи передавать text prop, внутри держать currentText ref. С помощью toRef(props, "text") можно управлять текстом как меняя text снаружи компонента, так и с помощью currentText.value = "new value" внутри него.

0

19.07.2023

Kirill 🍅 Romanov

Ну это и есть мутация пропса изнутри

0

19.07.2023

Sasha Автор вопроса

Kirill 🍅 Romanov
Ну это и есть мутация пропса изнутри

А в чем именно мутация? Здесь же только односторонняя привязка. Изменение prop меняет состояние, но изменение состояния не меняет prop. Если я правильно понял работу toRef.

0

19.07.2023

Volodymyr Klimov

Sasha
А в чем именно мутация? Здесь же только односторон...

Да toRefs - просто утилита, чтобы из объекта сделать нормальный реактивный объект

0

19.07.2023

¿Сергей?

Sasha
А в чем именно мутация? Здесь же только односторон...

Вы хотите при маунте компонента делать копию пропса чтобы локально его менять?

0

19.07.2023

Sasha Автор вопроса

¿Сергей?
Вы хотите при маунте компонента делать копию пропс...

Ага.

0

19.07.2023

¿Сергей?

Sasha
Ага.

Тогда это нормально, довольно часто бывает полезно

0

19.07.2023

Sasha Автор вопроса

Volodymyr Klimov
Да toRefs - просто утилита, чтобы из объекта сдела...

Чтобы сделать из объекта реактивный объект toRef не нужен. Достаточно const reactiveObj = reactive(notReactiveObj).

0

19.07.2023

Volodymyr Klimov

Так они по разному работают

0

19.07.2023

Sasha Автор вопроса

Volodymyr Klimov
Так они по разному работают

Вы писали "чтобы из объекта сделать нормальный реактивный объект". Это можно сделать без toRef.

0

19.07.2023

Sasha Автор вопроса

Kirill 🍅 Romanov
Ну это и есть мутация пропса изнутри

Накидал пример https://is.gd/frojZL (сокращенная ссылка на Vue SFC playground). Похоже вы были правы и toRef для моей цели не подойдет. Как бы вы решили задачу по ссылке?

0

19.07.2023

Stanislav Lashmanov

Sasha
Ну например компонент, внутри которого есть поле в...

Это называется деривативный стейт (стейт от стейта). Всё идёт хорошо ровно до того момента пока вам не нужно его синхронизировать в обе стороны.

0

19.07.2023

Sasha Автор вопроса

Stanislav Lashmanov
Это называется деривативный стейт (стейт от стейта...

Как тогда решать вот такую задачу https://is.gd/frojZL храня состояние в дочернем компоненте?

0

19.07.2023