React v16.2引入了另一种返回多个元素的方法。通过一个空标签以JSX方式抽象的React.Frage。请记住，JSX语法不支持属性——如果需要，请使用详细的方法。不需要额外的组件，不需要数组表示法，也不需要键。美好的
我试图从下面的方法返回多个值，并在return语句中得到一个类似属性赋值的错误，我的方法如下所示，
export const useSectionQuery = (query, resultFieldName, updateState, transform, initialRevisionId) => {
const [completed, setCompleted] = useState(false);
let transformed;
const { loading, error } = useQuery(query, {
variables: {
where: initialRevisionId ? { initialRevisionId } : { isApproved: true },
order_by: null
},
fetchPolicy: 'network-only',
onCompleted: data => {
transformed = transform ? transform(data[resultFieldName]) : data[resultFieldName];
updateState(draft => {
draft[resultFieldName] = transformed;
});
setCompleted(true);
}
});
if (error) return errorRedirectElement(error, resultFieldName);
return {(!completed || loading) && loadingElement, transformed };
};
并且在下面的行中得到错误CCD_ 2
return {(!completed || loading) && loadingElement, transformed }
您只需要用<反应片段>返回语句中的标签
const App = () => (
<React.Fragment>
<p>React 16 can return multiple elements ❤️</p>
<p>React 16 can return multiple elements ❤️</p>
<p>React 16 can return multiple elements ❤️</p>
</React.Fragment>
);
如果您不使用JSX进行渲染，则需要将(!completed || loading) && loadingElement分配给属性名
所以应该是
return {
element: (!completed || loading) ? loadingElement : null,
transformed
}
如果你在render()中这样做，你可以这样做，它会起作用。返回对象时不会。
render() {
{(!completed || loading) && loadingElement}
}