Question

我正在使用redux-form在react-redux应用程序中创建一个非常简单的输入表单。我正在跟着redux-form页面的例子，但它给我一个错误。错误的来源是尝试将component道具设置为React.DOM.input。它抛出了这个错误：

TypeError: _react2.default.DOM is undefined

但是，如果我将字符串'input'传递给component道具，它可以正常工作，我可以在我的redux开发工具中看到更改后的状态。我只是不确定我想把它作为一个字符串放在哪里，现在我非常好奇。

let SubsForm = ({ handleSubmit, availScripts }) => {
    const subs = availScripts.map(script =>
        [
            <label htmlFor={script}>{script}</label>,
            <Field key={script} component={React.DOM.input} type="checkbox" name={script} />,
            <br />,            
        ]
    );

    return [
        <form>
            {subs}
        </form>
    ];
};

由于

Answer 1

import ReactDOM from "react-dom"和React.DOM之间存在差异。

"react-dom"包是将React组件呈现为HTML页面所需的内容。

同时，React.DOM是一组用于在渲染方法中创建虚拟DOM元素的工厂函数。它是moved out into a separate react-dom-factories package，并且不再是React 16中React主程序包的一部分。

React.createElement()将React组件类型或字符串DOM HTML元素名称作为其第一个参数。 React.DOM工厂函数包含了一些过程。所以，这些是相同的：

React.createElement("input", {name : "myInput"});
React.DOM.input({name : "myInput"})

Answer 2

尝试导入反应组件。

 import React from "react";

Redux-Form：将“component”prop设置为“React.DOM.input”会产生错误

2 个答案: