【问题标题】:Component nothing to return error on a Next.js/React project组件在 Next.js/React 项目中没有返回错误
【发布时间】:2020-10-07 14:50:09
【问题描述】:

我正在使用 Nextjs/React 和 Emotion 构建一个图像滑块组件。

我觉得我做的一切都正确!但是我仍然遇到古老的错误......

Error: ImageSliderContainer(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

这里是组件...

import ReactDOM from "react-dom";
import ImageSlider from "./ImageSlider";

const images = [
  "https://images.unsplash.com/photo-1449034446853-66c86144b0ad?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80",
  "https://images.unsplash.com/photo-1470341223622-1019832be824?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2288&q=80",
  "https://images.unsplash.com/photo-1448630360428-65456885c650?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80",
  "https://images.unsplash.com/photo-1534161308652-fdfcf10f62c4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2174&q=80",
];

const ImageSliderContainer = () => {
  <ImageSlider slides={images} />;
};

export default ImageSliderContainer;

如果您需要查看其他组件,请在 cmets 中告诉我。我真的希望这只是我缺少的一些愚蠢的东西。

谢谢!

【问题讨论】:

    标签: javascript reactjs next.js emotion


    【解决方案1】:

    错误即将到来,因为您还没有返回任何东西。只需将其替换为:

    const ImageSliderContainer = () => {
      return <ImageSlider slides={images} />;
    };
    

    【讨论】:

      【解决方案2】:

      ImageSliderContainer 组件中没有返回任何内容。只需添加 return 语句,它应该可以工作!

      const ImageSliderContainer = () => {
        return <ImageSlider slides={images} />;
      };
      
      

      希望这会有所帮助!

      【讨论】:

      • 我知道我错过了一些愚蠢的东西!非常感谢
      猜你喜欢
      • 2021-03-16
      • 2021-01-04
      • 2021-04-06
      • 1970-01-01
      • 2012-12-12
      • 2021-09-17
      • 2022-11-03
      • 2021-03-31
      • 2018-05-15
      相关资源
      最近更新 更多