使用react和es6清理电子邮件输入

Question

I'm trying to go through my state and pull out the contents of recEmail, cc and bcc. Inside each, you can have multiple emails seperated by a ,. For example

recEmail could have: email1@email.com, email2@email.com
cc could have: email3@email.com, email4@email.com

I'm using lodash to loop through the "this.state" object and push the emails into an array, but then i'd have to loop through this new array to seperate out the emails into 1 email per array position (so i can then run a regex and see if it's a valid email or not).

This method seems very messy and I can't help but think there's a better way to go about this. Here's what I have so far.

 this.state = {recEmail: '', cc: '', bcc: '', subject: '', bodyText: '', testInput: false}; stateCleaner(emails){ var emailstoClean = []; _.forOwn(emails, (value, key) => { console.log('these are the keys: ', key); console.log('these are the values: ', value); if(key !== 'testInput'){ emailstoClean.push(value.split(', ')) } }) console.log('final emailstoClean: ', emailstoClean); return emailstoClean } 

This gives me two emails in index zero of the emailstoClean array, and two emails in position 1 (I entered two in the recEmail, and two in the cc field).

Is there a way I can simplify this further to just get one email in each array index? Also maybe it's slightly related but including a regex for how to check if it's a valid email would be great too. If there's any other details you all need just let me know. I appreciate everyone's assistance.

Answer 1

Few things: emails are surprisingly complicated - a quick google will confirm that regex is not the best way to validate them.

For your emails to array, you don't need lodash Tke your email strings directly from your state properties and call split(',') on each of them. This will give you an array of emails. Do this for all the email items in your state object and then call concat on the arrays or use the new spread operator to chuck them all in a single array with unique indexes.

Then you can use map, filter or some to process each email address in the array.