CODEWITHSUNDEEP
htmlreactjsjsx
Michael Lee
Michael Lee

Reputation: 327

How to display a value in my title attribute

Is there a way to add a value into my title attribute inside my Dropdown tag. For example I want to get title='Lead' + {this.state.candidate.length}. I am also using Dropdown from 'rsuite'. 

<Sidenav className="nav1-full" defaultOpenKeys={['1']} activeKey="1">
  <Sidenav.Body>
    <Nav className="nav-bar">
      <Dropdown className="nav1-body" eventKey="1" title="Lead">
        <Dropdown.Item eventKey="1-1" href="/candidates/1">
          Exploratory
        </Dropdown.Item>
        <Dropdown.Item eventKey="1-2" href="/candidates/2">
          Phone Intro
        </Dropdown.Item>
      </Dropdown>
    </Nav>
  </Sidenav.Body>
</Sidenav>

Upvotes: 0

Views: 418

Answers (4)

ESI
ESI

Reputation: 2057

Since anything inside {} is an inline JSX expression, you can do:

 title={"Lead" + this.state.candidate.length}

You can also use ES6 string interpolation/template literals with `` (backticks) and ${expr} , like this:

 title={`Lead${this.state.candidate.length}`}

Hope it helps.

Upvotes: 1

Vlad Serdyuk
Vlad Serdyuk

Reputation: 200

You need to wrap your prop in brackets {} instead of quotes

In the brackets you can write any javascript code:

<Dropdown title={'Lead ' + this.state.candidate.length}>

ES6 way:

<Dropdown title={`Lead${his.state.candidate.length}`}>

Upvotes: 1

AdamKniec
AdamKniec

Reputation: 1717

Try this. Simple template string solution.

 title={`WhateverYouWantHere`}

Upvotes: 0

Damian Green
Damian Green

Reputation: 7505

   title={`Lead${this.state.candidate.length}`}

Should do the trick

Upvotes: 0

Related Questions