Name of key in React.js for unselectable css

Question

I defined a css object inside of my render method but I am trying to figure out how to make text unselectable. React.js has their own key names like backgroundColor instead of background-color for css objects. I am trying to figure out key name for unselectable styles? Example:

	render:function(){
		var ListItems={
			cursor:'pointer',
			color:'black',
			marginLeft:'-20px',
			marginTop:'-10px',
			marginBottom:'14px',
			userSelect:'none',
		}
		if(this.state.linkHover=='hoverLink'){
			ListItems.color='blue';
		}else{
			ListItems.color='black';
		}
			return (
				<div>
				<li style={ListItems} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave} onClick={this.onClick}><input type="checkbox" checked={this.state.checked} unselectable="on"/>{this.props.value}</li>
				</div>
			)
	}

userSelect doesn't seem to work in Chrome. Is there a different name?

Answer 1

user-select has the following css names:

-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;

According to this, react's names are:

MozUserSelect: "none"
WebkitUserSelect: "none"
msUserSelect: "none"

Every hyphen - and the following character is replaced by according uppercase letter.