TypeError: невозможно прочитать свойство substr со значением null - React

У меня есть такой код в React ...

import React, { Component } from 'react';

class Card extends Component {
constructor(props) {
    super(props);
    this.state = {
        eventName: props.eventName,
        eventDate: props.eventDate,
        eventDesc: props.eventDesc,
        eventPic: props.eventPic
    }
}

render () {

    const { eventDate, eventDesc, eventName, eventPic } = this.state;
    return (
        <article className = "br2 ba dark-gray b--black-10 dib ma3 mw5 shadow-hover">
            <img src = {eventPic} className = "db w-100 br2 br--top" alt = {eventName} />
            <div className = "pa2 ph3-ns pb3-ns">
                <div className = "dt w-100 mt1">
                    <div className = "dtc">
                        <h1 className = "f5 f4-ns mv0">{eventName}</h1>
                    </div>
                    <div className = "dtc tr">
                        <h2 className = "f5 mv0">{eventDate}</h2>
                    </div>
                </div>
                <p className = "f6 lh-copy measure mt2 mid-gray">
                    {eventDesc.substr(0, 140)}
                </p>
            </div>
        </article>
    )
}
}

export default Card;

Проблема, с которой я столкнулся, заключается в этом блочном коде

{eventDesc.substr(0, 140)} // This is meant to limit the eventDescription's chars.

это дает мне TypeError: невозможно прочитать свойство substr, равное нулю.

Не могли бы вы помочь мне, как преодолеть эту ошибку? Спасибо