Эта страница еще не переведена

Чтобы добавить перевод, откройте Pull Request по этой ссылке.

Отображается содержимое для языка по умолчанию. 

import { useVModel } from "effector-vue/composition";

A hook function, which subscribes to a watcher that observes changes in the current store, so when recording results, the component will automatically update. It is primarily used when working with forms (v-model) in Vue 3.

Methods

useVModel($store)

Formulae

useVModel($store: Store<State>): Ref<UnwrapRef<State>>;

Designed for Vue 3.

Arguments

  1. $store (Store)
  2. shape of Stores (Store)

Returns

(State)

Examples

Single Store

import { createStore, createApi } from "effector";
import { useVModel } from "effector-vue/composition";


const $user = createStore({
  name: "",
  surname: "",
  skills: ["CSS", "HTML"],
});


export default {
  setup() {
    const user = useVModel($user);


    return { user };
  },
};
<div id="app">
  <input type="text" v-model="user.name" />
  <input type="text" v-model="user.surname" />


  <div>
    <input type="checkbox" v-model="user.skills" value="HTML" />
    <input type="checkbox" v-model="user.skills" value="CSS" />
    <input type="checkbox" v-model="user.skills" value="JS" />
  </div>
</div>

Store Shape

import { createStore, createApi } from "effector";
import { useVModel } from "effector-vue/composition";


const $name = createStore("");
const $surname = createStore("");
const $skills = createStore([]);


const model = {
  name: $name,
  surname: $surname,
  skills: $skills,
};


export default {
  setup() {
    const user = useVModel(model);


    return { user };
  },
};
<div id="app">
  <input type="text" v-model="user.name" />
  <input type="text" v-model="user.surname" />


  <div>
    <input type="checkbox" v-model="user.skills" value="HTML" />
    <input type="checkbox" v-model="user.skills" value="CSS" />
    <input type="checkbox" v-model="user.skills" value="JS" />
  </div>
</div>
Перевод поддерживается сообществом

Документация на английском языке - самая актуальная, поскольку её пишет и обновляет команда effector. Перевод документации на другие языки осуществляется сообществом по мере наличия сил и желания.

Помните, что переведенные статьи могут быть неактуальными, поэтому для получения наиболее точной и актуальной информации рекомендуем использовать оригинальную англоязычную версию документации.

Соавторы
Commits