ReactJs'de tag niteliği değeri nasıl alınır?

Question

Reajelerle küçük bir uygulama oluşturdum. Düğme etiketinde bir özellik belirledim ve değeri ilettim. Düğmeye tıkladığımda bu özellik değerini almam gerekiyor. Bu tepki js ile nasıl elde edilir?

Örnek kod,

var React = require('react'); 
var CommentWall = React.createClass({ 
    getInitialState:function(){ 
    return { 
     data:[] 
    } 
    }, 
    commentOpen:function(event){ 
    var targetID = this.state.dataId; 
    console.log(targetID); 
    $.ajax({ 
    url:url+"comments/"+targetID, 
    type:"GET", 
    dataType:"JSON", 
    success:function(data){ 
     this.setState({data:data}); 
    }); 
    } 
    render:function(){ 
    var wallCard; 
    var commentWall = this.props.data.map(function(el, i){ 
     wallCard = <div className="card-content"> 
      <div className="content-inner">{el.LINES}</div> 
      <button dataId={el.ID}>Click</button> 
     </div>; 
     return <div className="card wall-card" key={i}>{wallCard}</div>; 
    }.bind(this)); 
    return (
     <div>{commentWall}</div> 
    ); 
    } 
}); 

module.exports = CommentWall; 

Answer 1

Devlet - bu sadece data anahtara sahip senin CommentWall bileşenleri, devlet var, tıklandığı elemanın devlet değildir. Öznitelik kullanılması gerekli değildir. React-way değildir.

Kimliğinizi işleve iletmek için kapatıp basit bir bağlantı kurabilirsiniz. bağlama ile

Örnek:

var React = require('react'); 
var CommentWall = React.createClass({ 
    getInitialState: function(){ 
    return { 
     data:[] 
    } 
    }, 

    commentOpen: function(targetID, event){ 
    console.log(targetID); 
    $.ajax({ 
    url:url+"comments/"+targetID, 
    type:"GET", 
    dataType:"JSON", 
    success:function(data){ 
     this.setState({data:data}); 
    }); 
    }, 

    render:function(){ 
    var wallCard; 
    var commentWall = this.props.data.map(function(el, i){ 
     wallCard = <div className="card-content" onClick={this.commentOpen.bind(this, el.ID)> 
      <div className="content-inner">{el.LINES}</div> 
      <button>Click</button> 
     </div>; 
     return <div className="card wall-card" key={i}>{wallCard}</div>; 
    }.bind(this)); 
    return (
     <div>{commentWall}</div> 
    ); 
    } 
}); 

module.exports = CommentWall;