बूटस्ट्रैप टूलटिप react.js

Question

के साथ काम नहीं कर रहा है मैं पूरी जानकारी प्रदर्शित करने के लिए बटन पर बूटस्ट्रैप टूलटिप का उपयोग करने का प्रयास कर रहा था। लेकिन यह काम नहीं कर रहा है। टूलटिप प्रदर्शित नहीं हो रहा है।

<button type="button" ref="data" value={this.props.data} onClick={this.submit} className="btn btn-default btn-block" data-toggle="tooltip" data-placement="top" title={ this.props.data }> 
{ this.props.data.length > 20 ? 
this.props.data.substring(0, 20)+'...' : this.props.data } 
</button> 

मैं भी तरह बूटस्ट्रैप की जावास्क्रिप्ट पद्धति का उपयोग करके इसे शामिल करने की कोशिश:

यहाँ मेरी कोड प्रतिक्रिया है

<script> 
$(function() { 
    $('[data-toggle="tooltip"]').tooltip() 
}) 
</script> 

मैं इसके लिए क्या करना चाहिए? धन्यवाद ..

Answer 1

मैं केवल एक डेमो है कि आप दस्तावेज़ तैयार पर .tooltip बुला रहे हैं बिना अनुमान लगा सकते हैं, लेकिन घटक से पहले वास्तव में गाया गया है।

प्रयास करें:

componentDidMount: function() { 
    this.attachTooltip(); 
}, 

componentDidUpdate: function() { 
    this.attachTooltip(); 
}, 

attachTooltip: function() { 
    $(this.refs.data).tooltip(); 
    // Or for React <0.14 - 
    // $(this.refs.data.getDOMNode()).tooltip(); 
} 

पुनश्च अपने बटन देने पर विचार की तुलना में अधिक सार्थक नाम रेफरी 'डेटा'