Help with dispatch methods

General
1

Hi everyone,
I am looking for solution to update the array data with jsonforms, so far I can only modify the array data using built in removeItem and addItem

Thanks

2

Hi @bangank36,

Internally we use a useReducer based state for the form-wide data. You can retrieve the dispatcher to this state via useJsonForms(). We have a number of actions which are supported. You can conveniently create them via “Actions.xyz”, e.g. Actions.update(path, updater).

So for example to empty the array completely, you can execute:

import { Actions } from '@jsonforms/core';
import { useJsonForms } from '@jsonforms/react';

// in the renderer code
const ctx = useJsonForms();
ctx.dispatch(Actions.update(path, () => []);

The handleChange, removeItem etc. functions are just convenience wrappers around this dispatch function.

// Edited the code example to be valid for React

3

Hey @sdirix ,

When I try to use useDispatch, i get an error saying that there is no export.

Cheers,
Chat.

4

Hi @chathuraa,

You’re right I got this mixed up between our React and Vue bindings. In React you can access the dispatch method via useJsonForms, e.g.

import { useJsonForms } from '@jsonforms/react';

const ctx = useJsonForms();
const dispatch = ctx.dispatch;