coryhouse / pluralsight-redux-starter

Completed Dev Environment for "Building Applications with React and Redux" on Pluralsight
https://app.pluralsight.com/library/courses/react-redux-react-router-es6/
1.27k stars 914 forks source link

cannot read property 'map' of undefined at SelectInput.js: 15 #68

Closed ashfaqrafi closed 7 years ago

ashfaqrafi commented 7 years ago

@coryhouse Node version: 6.3.1

npm version: 3.10.3

Operating system: Ubuntu 16.04

Command line used: Terminal

Steps to reproduce: in this code block of SelectInput.js files line 15

{options.map((option) => { return ; }) } I get this error when I run the app: SelectInput.js:15 Uncaught TypeError: Cannot read property 'map' of undefined

Here is the content of the file SelectInput.js

import React, {PropTypes} from 'react';

const SelectInput = ({name, label, onChange, defaultOption, value, error, options}) => {
  return (
    <div className="form-group">
      <label htmlFor={name}>{label}</label>
      <div className="field">
        {/* Note, value is set here rather than on the option - docs: https://facebook.github.io/react/docs/forms.html */}
        <select
          name={name}
          value={value}
          onChange={onChange}
          className="form-control">
          <option value="">{defaultOption}</option>
          {options.map((option) => {
            return <option key={option.value} value={option.value}>{option.text}</option>;
          })
          }
        </select>
        {error && <div className="alert alert-danger">{error}</div>}
      </div>
    </div>
  );
};

SelectInput.propTypes = {
  name: PropTypes.string.isRequired,
  label: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
  defaultOption: PropTypes.string,
  value: PropTypes.string,
  error: PropTypes.string,
  options: PropTypes.arrayOf(PropTypes.object)
};

export default SelectInput;
coryhouse commented 7 years ago

That means options isn't defined on line 15. Make sure you're passing a value in for that prop. :)