Javascript 我犯了这个错误>&燃气轮机；没有从render返回任何内容。这通常意味着缺少返回语句。或者，要不呈现任何内容，请返回null

如果data.alarmMode==EMERGENCY，我希望呈现模态组件，但是，我无法呈现任何内容并获取此错误。我已尝试解决此问题，但无法解决此问题。我不知道为什么react不能呈现模态组件

 return (

                <Modal key={hash} hash={hash} data={alarmData[hash]} onClickAlarmOff={onClickAlarmOff} clockMode={clockMode} onClickCloseModal={onClickCloseModal} />
              )  

mpodalOn没有问题，我检查了模态状态是否已更改 我进行了调试，调试器进入了if（data.alarmMode==EMERGENCY） 问题是当时钟盒组件无法渲染模式组件时。。。。

---

如果我使用了return语句

我想这可能是因为在下面的if语句之后没有else语句：

if（data.time==timeString&&data.on）

。

---

因此，如果不满足此要求，React将不知道要呈现什么。

我添加了else语句和return语句，但效果不好……能否更新帖子中的代码？你也可以发布模态组件的内容吗？你也可以添加makeModalvisible（）方法的函数定义吗？好的，我真的不知道会出什么问题。除了在组件的呈现内部调用makeModalvisible（）函数。也许您可以尝试将makeModalvisible（）函数更改为以下内容：makeModalvisible:（）=>{dispatch（modalOn（））；return null；}好的，如果您还有任何问题，请告诉我！如果我的答案足够的话，别忘了对我的答案投赞成票：）

import React, { useState } from 'react';
import CurrentTimeBox from './CurrentTimeBox';
import AlarmList from './AlarmList';
import AddAlarm from './AddAlarm';
import styles from './ClockBox.module.css';
import ModalEvent from '../containers/ModalEvent';
import { EMERGENCY, NIGHT } from '../constants';
import Modal from '../components/Modal';
import ClockModeBox from './ClockModeBox';
const ClockBox = ({ timeString, onClickCloseModal, makeModalvisible, currentTime, clockMode, modal, alarmData, onClickAlarmOn, onClickAlarmOff, ClockModeFunctionLists }) => {
  return (
    <div className={styles.ClockBox}>
      <CurrentTimeBox currentTime={currentTime} />
      <ClockModeBox ClockModeFunctionLists={ClockModeFunctionLists} clockMode={clockMode}/>
      <div className={styles.AlarmLists}>
        {Object.keys(alarmData).length > 1 && alarmData.dataLists.map((hash) =>{
            const data = alarmData[hash]
          return (
            <AlarmList key={hash} hash={hash} data={data} onClickAlarmOn={onClickAlarmOn} onClickAlarmOff={onClickAlarmOff}/>
          )
        })
        }
      </div>
      <AddAlarm />
      {timeString.length > 0 && Object.keys(alarmData).length > 1 ? alarmData.dataLists.map((hash) => {
        const data = alarmData[hash]
        if (data.time === timeString && data.on) {
          if (clockMode === NIGHT) {
            if (data.alarmMode === EMERGENCY) {
              makeModalvisible();
              return (

                <Modal key={hash} hash={hash} data={alarmData[hash]} onClickAlarmOff={onClickAlarmOff} clockMode={clockMode} onClickCloseModal={onClickCloseModal} />
              )   
            } else {
              return null;
            }
          }

          makeModalvisible();
          // if (modal) {
            return (
              <Modal key={hash} hash={hash} data={alarmData[hash]} onClickAlarmOff={onClickAlarmOff} clockMode={clockMode} onClickCloseModal={onClickCloseModal} />
            )
          // }
        }
      }) : null
      }
    </div>
  )

};

export default ClockBox;

  return (
    <div className={styles.ClockBox}>
      <CurrentTimeBox currentTime={currentTime} />
      <ClockModeBox ClockModeFunctionLists={ClockModeFunctionLists} clockMode={clockMode}/>
      <div className={styles.AlarmLists}>
        {Object.keys(alarmData).length > 1 && alarmData.dataLists.map((hash) =>{
            const data = alarmData[hash]
          return (
            <AlarmList key={hash} hash={hash} data={data} onClickAlarmOn={onClickAlarmOn} onClickAlarmOff={onClickAlarmOff}/>
          )
        })
        }
      </div>
      <AddAlarm />
      {timeString.length > 0 && Object.keys(alarmData).length > 1 ? alarmData.dataLists.map((hash) => {
        const data = alarmData[hash]
        if (data.time === timeString && data.on) {
          debugger;
          if (clockMode === NIGHT) {
            if (data.alarmMode === EMERGENCY) {
              makeModalvisible();
              return (

                <Modal key={hash} hash={hash} data={alarmData[hash]} onClickAlarmOff={onClickAlarmOff} clockMode={clockMode} onClickCloseModal={onClickCloseModal} />
              )   
            } else {
              return null;
            }
          }

          makeModalvisible();
          // if (modal) {
            return (
              <Modal key={hash} hash={hash} data={alarmData[hash]} onClickAlarmOff={onClickAlarmOff} clockMode={clockMode} onClickCloseModal={onClickCloseModal} />
            )
          // }
        } else {
          return null;
        }
      }) : null
      }
    </div>
  )

import React from 'react';
import { VIBRATION, NORMAL, NIGHT } from '../constants';
import styles from "./Modal.module.css";

const Modal = ({ onClickCloseModal, data, clockMode, hash, onClickAlarmOff }) => {

  const SOUND_EFFECT = 'https://pp.netclipart.com/pp/s/35-354079_jpg-transparent-library-hotel-front-desk-service-bell.png';
  const VIBRATION_EFFECT = 'https://st2.depositphotos.com/4520249/7558/v/950/depositphotos_75586693-stock-illustration-vibration-mode-phone-icon.jpg';
  let imgComponent = null;
  switch(clockMode) {
    case NORMAL:
      imgComponent = <img src={SOUND_EFFECT} />
      break;
    case VIBRATION:
      imgComponent = <img width="200px" height="200px" src={VIBRATION_EFFECT} />
      break;
    default:
      return;
  }


  return (
    <div className={styles.Modal} >
      <div className={styles.ModalOverLay}></div>
        <div className={styles.ModalContent}>
          {imgComponent}
          <p>{data.label}</p>
          <button className={styles.CloseButton} onClick={() => {
            onClickCloseModal();
            onClickAlarmOff(hash);
            console.log(33333)
          }}>close</button>
      </div>
    </div>
  )
}

export default Modal;

const modalOn = () => ({ type: MODAL_ON });
makeModalvisible: () => dispatch(modalOn())