jsdevkr / React Multi Email
Licence: mit
A simple react component to format multiple email as the user types.
Stars: ✭ 111
Programming Languages
typescript
32286 projects
Projects that are alternatives of or similar to React Multi Email
Aaronvandenberg.nl
⚛️ Web Developers portfolio build with Gatsby.js & React.js
Stars: ✭ 98 (-11.71%)
Mutual labels: express
Express Jwt
An example API for creating/verifying json web tokens
Stars: ✭ 105 (-5.41%)
Mutual labels: express
Mean Stack Angular5 Crud
MEAN Stack (Angular 5) CRUD Web Application Example
Stars: ✭ 107 (-3.6%)
Mutual labels: express
Art Template
High performance JavaScript templating engine
Stars: ✭ 9,554 (+8507.21%)
Mutual labels: express
Vue2 Shop
A shop developed with Vue2 + Vue-router + Axios + Vuex + Node + Express + MongoDB + Webpack
Stars: ✭ 103 (-7.21%)
Mutual labels: express
Simple React Full Stack
Boilerplate to build a full stack web application using React, Node.js, Express and Webpack.
Stars: ✭ 1,506 (+1256.76%)
Mutual labels: express
Webpack Hmr 3 Ways
Three ways to set up your webpack hot module replacement: webpack-dev-server CLI, webpack-dev-server API, and express with webpack-hot-middleware.
Stars: ✭ 108 (-2.7%)
Mutual labels: express
Meanstackjs
Mean Stack JS - MongoDB, Express JS, Angular JS & Node JS
Stars: ✭ 104 (-6.31%)
Mutual labels: express
Express Postgres Starter
A starter project for Node.js with Express and Postgres running on Docker Compose
Stars: ✭ 107 (-3.6%)
Mutual labels: express
Zhaopinapp
一个基于react16,redux,react-router4,antd-mobile,axios及node,express,mongodb实现的全栈招聘类webapp项目。
Stars: ✭ 100 (-9.91%)
Mutual labels: express
Porn Vault
💋 Manage your ever-growing porn collection. Using Vue & GraphQL
Stars: ✭ 1,634 (+1372.07%)
Mutual labels: express
Typescript Node Starter
A reference example for TypeScript and Node with a detailed README describing how to use the two together.
Stars: ✭ 10,111 (+9009.01%)
Mutual labels: express
Angular Seed Express
[DEPRECATED, Please use https://github.com/vyakymenko/angular-express] Extensible, reliable and modular starter project for Angular 7 with statically typed build AoT compilation, Express server and PM2 Daemon.
Stars: ✭ 107 (-3.6%)
Mutual labels: express
Nightcat
个人博客,技术栈:NodeJS + Express + mongoose + GraphQL + Vue 全家桶
Stars: ✭ 97 (-12.61%)
Mutual labels: express
Netlify Functions Express
How to use Netlify functions + express.js for serverside rendering on the JAMStack
Stars: ✭ 105 (-5.41%)
Mutual labels: express
Nodejs Mysql Links
A CRUD Web Application with authentication using Nodejs, Mysql and other Javascript technologies
Stars: ✭ 110 (-0.9%)
Mutual labels: express
Flowmaker
flowmaker: JS to SVG flowchart generation extension for Vscode in realtime written in typescript and also download the SVG through local node server. Extension:
Stars: ✭ 108 (-2.7%)
Mutual labels: express
react-multi-email
A simple react component to format multiple email as the user types.
- Simple code
- No dependency
- Small size
- Simple customization
Installation
npm install react-multi-email -S
Usage
import * as React from 'react';
import { ReactMultiEmail, isEmail } from 'react-multi-email';
import 'react-multi-email/style.css';
interface IProps {}
interface IState {
emails: string[];
}
class Basic extends React.Component<IProps, IState> {
state = {
emails: [],
};
render() {
const { emails } = this.state;
return (
<>
<h3>Email</h3>
<ReactMultiEmail
placeholder="placeholder"
emails={emails}
onChange={(_emails: string[]) => {
this.setState({ emails: _emails });
}}
validateEmail={email => {
return isEmail(email); // return boolean
}}
getLabel={(
email: string,
index: number,
removeEmail: (index: number) => void,
) => {
return (
<div data-tag key={index}>
{email}
<span data-tag-handle onClick={() => removeEmail(index)}>
×
</span>
</div>
);
}}
/>
<br />
<h4>react-multi-email value</h4>
<p>{emails.join(', ') || 'empty'}</p>
</>
);
}
}
export default Basic;
License
If you don't mind, don't forget to press "star" before leaving.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].