你遇到的这个React错误#130，核心原因是组件的导出方式和导入方式不匹配，具体细节如下：

1. 在./MyInput.react.js中，你使用的是默认导出：

   import React from 'react'; 
   export default class MyInput extends React.Component {
     // 组件内部代码
   }
   

2. 但在./index.js里，你却用了命名导入的语法：

   import {MyInput} from './MyInput.react';
   

这两种语法不兼容，导致React找不到你要使用的组件，所以抛出了"Element type is invalid: expected a string... but got: undefined"的错误——本质是你试图导入的MyInput变量值为undefined。

两种修复方案任选其一： #

方案1：修改导入语法（适配默认导出）

把index.js里的导入语句改成默认导入的写法，去掉包裹组件名的花括号：

import MyInput from './MyInput.react';

方案2：修改导出语法（适配命名导入）

如果你更倾向于使用命名导入，可以调整MyInput.react.js里的导出方式，去掉default关键字改成命名导出：

import React from 'react'; 
// 去掉default，改为命名导出
export class MyInput extends React.Component {
  // 组件内部代码
}

这样原来的import {MyInput} from './MyInput.react';就能正常工作了。

额外提醒：你的组件里用到了getNextId()函数，要确保这个函数已经被正确定义和导入，不然后续可能会出现新的运行时错误哦。

内容的提问来源于stack exchange，提问作者Roman