Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

any chance for the tags to be editable? #186

Open
paigeflourin opened this issue Nov 29, 2018 · 5 comments
Open

any chance for the tags to be editable? #186

paigeflourin opened this issue Nov 29, 2018 · 5 comments

Comments

@paigeflourin
Copy link

paigeflourin commented Nov 29, 2018

i need this feature in my application

@vivekgusain3pg
Copy link

I am facing the same issue.

@davidbucka
Copy link

davidbucka commented Mar 1, 2019

Already got asked for in #137 & #184

@ChenCong6837
Copy link

I rewrite renderTag as follows, hope it helps

renderTag = (props) => {
	const { isTagFocus } = this.state
	const { tag, key, diasbled, onRemove, classNameRemove, getTagDisplayValue, ...other } = props
	return <span key={key} {...other} onBlur={() => { this.setState({ isTagFocus: false }) }}>
		{isTagFocus
			? <AutosizeInput
				onChange={this.hangdleTagChange}
				onFocus={(e) => {
					this.setState({
						tagEditIndex: this.state.inputBills.indexOf(e.target.value)
					})
				}}
				value={getTagDisplayValue(tag)}
				inputClassName={styles.tagEditInput}
			/>
			: <span onClick={() => { this.setState({ isTagFocus: true }) }}>
				{getTagDisplayValue(tag)}
			</span>
			}
			{!diasbled && <a className={classNameRemove} onClick={(e) => { onRemove(key) }}></a>}
	</span>
}

@FRickReich
Copy link

and how do you implement this?

@MosheSommers
Copy link

Simply add the renderTag prop like so
<TagsInput renderTag={this.renderTag}/>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants