Skip to main content

api.getReactiveState()

Description​

Gets an object with the reactive properties of File Manager

This method allows you to subscribe to the returned properties in the same way as actions.

Usage​

api.getReactiveState(): object;

Returns​

The method returns an object with the following reactive properties:

  {
    data, //an array of objects containing the files structure data
    mode,
    preview,
    search, // the search string 
    panels,
    drive,
    activePanel
  }

All properties description you can find here: File Manager properties overview

Example​

<script setup>
  import { Filemanager } from "@svar-ui/vue-filemanager";
  import { getData, getDrive } from "./common/data";

  import { watchEffect } from "vue";

  function init(api){
    const mode = api.getReactiveState().mode;
    watchEffect(() => console.log(mode.value)); //outputs mode on every mode change
  }
</script>

<template>
  <Filemanager :init="init" :data="getData()" :drive="getDrive()" />
</template>

Related articles: