import { createComponent } from "effector-vue";

since

createComponent introduced in effector-vue 20.3.0

Creates a Vue 2 component with the given stores bound to it. The stores are typed in this, which helps with TypeScript.

Methods

`createComponent(options, store?)`

Arguments

options (Object): component options (hooks, methods, computed properties)
store (Object): object of stores, passed to the component as its effector option

Returns

(vue component)

Example

<template> {{ $counter }} </template>

import { createStore, createApi } from "effector";
import { createComponent } from "effector-vue";

const $counter = createStore(0);
const { update } = createApi($counter, {
  update: (_, value: number) => value,
});

export default createComponent(
  {
    name: "Counter",

    methods: {
      update,
      handleClick() {
        const value = this.$counter + 1; // this.$counter <- number ( typescript tips )
        this.update(value);
      },
    },
  },
  { $counter },
);