B
B
BonBon Slick2021-07-11 14:13:13
Vue.js
BonBon Slick, 2021-07-11 14:13:13

Vue + Typescript name collision for action / getter from different namespaces, or how to solve Duplicate identifier?

const namespaceRegister = `${FORMS}/${FORM_REGISTER}`;
const namespaceVerifyCode = `${FORMS}/${FORM_VERIFY_CODE}`;

export default class RegisterForm extends Vue implements IRegistrationForm, IVerifyCodeForm  {
    @namespace(namespaceVerifyCode).Getter
    isSending!: boolean;
    @namespace(namespaceRegister).Getter
    isSending!: boolean;


It is clear that namespaces are registered for each module
import state     from './state';
import mutations from './mutations';
import actions   from './actions';
import getters   from './getters';

export default {
    namespaced: true,
    state,
    getters,
    mutations,
    actions,
};


But the form module extends the abstract module, that is, all forms have some of the same fields, getters, and actions.
And how then to use them in one template?

[tsl] ERROR in /var/www/test/src/components/public/not_secured/partials/forms/register/RegisterForm.ts(67,5)
      TS2300: Duplicate identifier 'isSending'.


There should be something in TS to resolve name collisions from different namespaces by type isSending as isVerifyCodeSending!: boolean;

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Aetae, 2021-07-11
@BonBonSlick

Decorators decorate an already finished object, after its creation, and not in the process.
Your code, if it worked, is logically equivalent to this:

export default class RegisterForm extends Vue implements IRegistrationForm, IVerifyCodeForm  {
    @namespace(namespaceRegister).Getter
    @namespace(namespaceVerifyCode).Getter
    isSending!: boolean;

If it suits you, then write it. No - come up with something else.
In a class instance (object) there cannot be two identical fields storing different values ​​at the same time. It's logical, no?
As far as I can tell, the record
@namespace(<vuex-path>).Getter
    isSending!: boolean;

This means that when we get the field, isSendingwe request the field from vuex at the address <vuex-path>, when we set the field isSending, we commit the field in vuex at the address <vuex-path>.
If one field sets and receives two values ​​at the same time in vuex - see above, although for good it is better to combine this in mutationand xs, is such a game provided for by this either. If it must be two separate meanings, then HOW do you imagine it?

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question