Блог

Главная - Вопросы по программированию - Ошибка типа: не удается прочитать свойство ‘resourceAreaWidth’ неопределенного полного календаря

Ошибка типа: не удается прочитать свойство ‘resourceAreaWidth’ неопределенного полного календаря

#javascript #reactjs #fullcalendar

#javascript #reactjs #полный календарь

Вопрос:

У меня есть этот компонент react

 import React from 'react'
import FullCalendar from '@fullcalendar/react'
import dayGridPlugin from '@fullcalendar/daygrid'
import timeGridPlugin from '@fullcalendar/timegrid'
import interactionPlugin from '@fullcalendar/interaction'
import resourceTimelinePlugin from '@fullcalendar/resource-timeline'
// import { Calendar } from '@fullcalendar/core'
import './calendar.scss'

const TempCalendar = () => {
  return (
    <FullCalendar
      plugins={[resourceTimelinePlugin, dayGridPlugin, timeGridPlugin, interactionPlugin]}
      timeZone="UTC"
      schedulerLicenseKey= 'CC-Attribution-NonCommercial-NoDerivatives'
      initialView="resourceTimelineDay"
      headerToolbar={{
        left: 'prev,next',
        center: 'title',
        right: 'resourceTimelineDay,resourceTimelineWeek,resourceTimelineMonth',
      }}
      editable
      resourceAreaHeaderContent="Rooms"
      resources="https://fullcalendar.io/demo-resources.json?with-nestingamp;with-colors"
      events="https://fullcalendar.io/demo-events.json?single-dayamp;for-resource-timeline"
    />
  )
}
export default TempCalendar

Я хочу воссоздать эту демонстрацию или эту демонстрацию, но как компонент react. Выше приведен код, который я написал, но я получаю эту ошибку
ошибка ss

Вот мой package.json

 "dependencies": {
    "@amcharts/amcharts4": "^4.9.23",
    "@ant-design/icons": "^4.0.3",
    "@apollo/react-hooks": "^3.1.3",
    "@fortawesome/fontawesome-svg-core": "^1.2.30",
    "@fortawesome/free-solid-svg-icons": "^5.14.0",
    "@fortawesome/react-fontawesome": "^0.1.11",
    "@fullcalendar/core": "^5.5.0",
    "@fullcalendar/daygrid": "^5.5.0",
    "@fullcalendar/interaction": "^5.4.0",
    "@fullcalendar/react": "^5.4.0",
    "@fullcalendar/resource-common": "^5.5.0",
    "@fullcalendar/resource-daygrid": "^5.5.0",
    "@fullcalendar/resource-timegrid": "^5.5.0",
    "@fullcalendar/resource-timeline": "^5.5.0",
    "@fullcalendar/timegrid": "^5.5.0",
    "@fullcalendar/timeline": "^5.5.0",
      "react": "^16.8.6",
]

Я не знаю, что я делаю не так, или это ошибка полного календаря. Пожалуйста, направьте меня

Ответ №1:

Понижение всех версий @fullcalendar до версии 5.1.0 исправило это для меня

Комментарии:

1. У меня была та же проблема, но Cannot read properties of undefined (reading 'resourceOrder') — удалось понизить версию до версии 5.3.1

Ответ №2:

Для меня решение состояло в том, чтобы убедиться, что все мои пакеты @fullcalendar имеют одну и ту же версию в моем файле package.json. Простое использование npm install или yarn add может привести к установке более новой версии пакета @fullcalendar, что приведет к несоответствию версий между некоторыми пакетами @fullcalendar. Как вы можете видеть из вашего файла package.json, некоторые из ваших пакетов @fullcalendar имеют версию 5.5.0, а другие — версию 5.4.0. Чтобы исправить это, я вручную изменил номер версии в моем файле package.json, а затем переустановил все зависимости моего проекта.

Метки: