asfmlr asfmlr - 3 months ago 71
React JSX Question

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined

I'm new to react, so maybe it will sound stupid to ask.

I'm try to add a select input on my page but keep getting:

ncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

ncaught TypeError: Cannot read property '__reactInternalInstance$1y5rcyzngdmlzew7wenq4zpvi' of null

My code is:

import React from "react";
import {Input} from "react-bootstrap";

render() {
return (
<div className="pickup-site-filter-container">
<span className="pickup-site-filter-label">Filter Locations by</span>
<span className="pickup-site-filter-zipCode">Zip Code:
<input className="filter-zipCode" type="text" pattern="[0-9]{5}" value={this.state.zipCode}
htmlFor="validation-error" ref="zipCode" onChange={this.onChangeZipCode}/>
</span>
<span className="pickup-site-filter-deliveryDay">Delivery Day:
<Input type="select" value="1" ref="valid_for">
<option value="1">1 hour</option>
<option value="2">1 day</option>
<option value="2">5 days</option>
</Input>
</span>
<button className="pickup-site-filter-btn" onClick={this.filterClicked}>FILTER</button>
</div>)
}


This is only the render cause i found out that also a select example doesn't work

Answer

Have you tried using <select></select> instead of <input type="select" />?