Nested mapMultiRowFields – a different approach

[geoidesic]

Probably the most requested feature and problem that people run into with this library is how to handle nested arrays of fields. Currently there is no solution in hand and for some forms, managing this is simply crucial. As an example imagine you are creating a form which has a list of countries (an array of objects) each country has a number of properties, one of which would be a list of expenses (i.e. an array of objects). We must find a best-practise solution for this scenario, which should be documented.

My approach was to use nested components and to pass in a dynamically defined property but I cannot find a way to use mapMultiRowFields with a dynamic parameter.

This example illustrates this idea but has an error (view the inspector): https://codesandbox.io/s/vuex-map-fields-problem-with-dynamic-parameter-for-mapmultirowfields-49j4c

The problem here is that the context for this does not exist. So the question then becomes, what is a possible alternate syntax for writing a computed property that allows a dynamic property referencing the Vue instance to be passed in?

I've tried a variety of things but I can't find a successful alternate syntax. E.g. instead of:

computed: {
    ...mapMultiRowFields('fooModule', [`people[${this.personIdx}].books`])
  },

We need something like:

computed: {
    books: vm => {
      return {... mapMultiRowFields('fooModule', [`people[${vm.personIdx}].books`])}
    }
  },

... but that doesn't work –  can't find a syntax that will work here for a dynamic parameter.

[geoidesic]

After a great deal of trial an effort, it's clear that this isn't possible by means other than those detailed here: #24 (comment)