Get function return inside a Vuex getter

Asked

Viewed 77 times

0

Good afternoon, I am using the vuetify bind Rules and in it a method that comes from inside a getter in a module. in bind the method returns in the best possible way, giving me error or succes and the message I determined doubt is the following, as I read the value returned outside this bind?

The bind is as follows

:rules="[ InputRules('required'), InputRules('email') ]"

If you do not enter anything, the required message appears (required) and if the email is not in the form of regex then the invalid email message appears, at this point, everything works very well, my only doubt is when I want to reuse the function, i wonder when it will return Booleam or Function using the contructoror something like that, the problem is, if I put in a console in this way

console.log(this.InputRules('email'))

only this returns me

ƒ (value) {
      return /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || text || 'E-mail inválido';
    }

tried several ways, like adding the constructor at the end but returns nothing but undefined how to receive if the value is the text or not, ie the case false is the text and the true case is Boolean (in this case, the false that it returns in the Rule bind)

my getter is this

const InputRules = () => (rule, text) => {
  if (rule === 'required') return value => !!value || (text || 'Obrigatório')
  if (rule === 'email') return value => /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || (text || 'E-mail inválido')
}

I realized that this

console.log([this.InputRules('email', value)])

gives me some information like the field and such.


Solution for those in need

Just change the return of Function, if you pass this

if (rule === 'email') return value => /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || (text || 'E-mail inválido')

for that reason

if (rule === 'email') {
    return (() => {
      return /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || (text || 'E-mail inválido')
    })(text, value)
  }

ready, this will return String or Boolean, String for Fail and Boolean for Success, now just call the getter in :Rule normally and in succes compare the constructor

  • Roberto, it would be nice if you put the solution you found as an answer and accept it as correct. It is better than adding the solution within the question.

  • I understand, I thought it would not be good practice, since I do not know if my solution is the most correct and I left open for a better solution from someone more experienced.

  • You can leave the answer for a while without accepting it as correct, so if no one answers you accept it. The important thing is that it is correct as an answer so that it is easier to find... You have the help of the site: I can answer my own question?

1 answer

0

Solution for those in need

Just change the return of Function, if you pass this

if (rule === 'email') return value => /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || (text || 'E-mail inválido')

for that reason

if (rule === 'email') {
    return (() => {
      return /^(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{1,63}\b)*@(\b[a-zA-Z0-9-]{1,63}\b)(\.\b[a-zA-Z0-9-]{2,63}\b)+$/i.test(value) || (text || 'E-mail inválido')
    })(text, value)
  }

ready, this will return String or Boolean, String for Fail and Boolean for Success, now just call the getter in :Rule normally and in succes compare the constructor

Browser other questions tagged

You are not signed in. Login or sign up in order to post.