const addForm = <Formik>
{(props) => (
<Form>
(ommited...)
</Form>
)}
</Formik>;
那按预期工作。令我惊讶的是，这个（第一个换行符被禁止）没有
const addForm = <Formik> {(props) => (
<Form>
(ommited...)
</Form>
)}
</Formik>;
我懂了 Error: React.Children.only expected to receive a single React element child.
这是预期的行为吗？我怎么理解？
如果您查看转译的代码，则可以更清楚地看到问题。第一个代码产生这个
"use strict";
var addForm = React.createElement(Formik, null, function (props) {
return React.createElement(Form, null, "(ommited...)");
});
"use strict";
var addForm = React.createElement(Formik, null, " ", function (props) {
return React.createElement(Form, null, "(ommited...)");
});
区别在于在第二种情况下，" "孩子还多了一个。这意味着Formik组件有两个子级，这是不允许的。
那么原始代码中的多余空间在哪里？这之间的空间<Formik>和{(props) => (。如果删除它，则两个版本之间的行为相同。代码的第一个示例仅在行首包含空格，而在编译时将忽略该空格，但是在行中间的空格很重要。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句