Set background image url using inline css in react js

I have setted inline css using react method but Compiler showing "unexpected token error" where i have declare image url, here is my file code -

class Aboutus extends React.Component {
    constructor(props){
        super(props);
        document.title = "About Us";
    }

    var imgUrl_1 = '/images/about/parallax.jpg';
    const style_1 = {
            padding: '250px 0', 
            backgroundImage: 'url('+imgUrl_1+')',
            backgroundSize: 'cover',
            backgroundPosition: 'center center',
        };

    var img_url2 = '/images/team/3.jpg';
    const style_2 = {
        backgroundImage: 'url('+img_url2+')', 
        backgroundPosition: 'center center no-repeat',
        backgroundSize: 'cover',    
        };

    const style_3 = { backgroundColor: '#F5F5F5'};  

    render(){
        return(
            <DefaultLayout>
                <section id="page-title" class="page-title-parallax page-title-dark" style={style_1} data-stellar-background-ratio="0.4">

                    <div class="container clearfix">
                        <h1>About Us</h1>
                        <span>Everything you need to know about our Company</span>
                        <ol class="breadcrumb">
                            <li><a href="#">Home</a></li>
                            <li><a href="#">Pages</a></li>
                            <li class="active">About Us</li>
                        </ol>
                    </div>

                </section>


                <section id="content">
                    <div class="content-wrap">
                        <div class="row common-height clearfix">
                            <div class="col-sm-5 col-padding" style={style_2} ></div>
                            <div class="col-sm-7 col-padding">
                                <div>
                                    <div class="heading-block">
                                        <span class="before-heading color">CEO &amp; Co-Founder</span>
                                        <h3>John Doe</h3>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="row common-height bottommargin-lg clearfix">
                            <div class="col-sm-7 col-padding" style={style_3} >
                                <div>
                                    <div class="heading-block">
                                        <span class="before-heading color">Developer &amp; Evangelist</span>
                                        <h3>Mary Jane</h3>
                                    </div>
                                </div>
                            </div>


                        </div>
                    </div>

                </section>
            </DefaultLayout>
        );  
    }
}

export default Aboutus;

It giving error here -

Unexpected token (11:5)    9 |  }
  10 |  
> 11 |  var imgUrl_1 = '/images/about/parallax.jpg';

please let me know what I am doing wrong here .