0
我在流星React有一些麻煩。反應不更新元素，但創建一個新的相同reactid
所以我有這些線在我的陣營類return語句
{this.renderRegisterButton()}
相應的功能是這樣的
renderRegisterButton: function() {
if (Meteor.user()) {
if (this.data.tournament.ongoing || this.data.tournament.date_finished) {
return ''
} else {
activeTournament = Meteor.players.getActiveTournament(Meteor.user()._id);
if (activeTournament) {
if (activeTournament._id == this.data.tournament._id) {
var playerStatus = Meteor.tournaments.findTournamentStatus(this.data.tournament._id);
if (playerStatus.status == 2) {
return <div className="alert alert-success alert-checkedin" role="alert">You have succesfully checked in! Hang on tight, the tournament will start soon!</div>
}
else if (playerStatus.status == 1 && this.data.tournament.checkin_open) {
return <button type="button" className="btn btn-default" onClick={this.attend}>Check in</button>
}
else if (playerStatus.status == 1 && !this.data.tournament.checkin_open) {
if (playerStatus.status == 1) {
return <button type="button" className="btn btn-default" onClick={this.removeAttend}>Withdraw</button>
} else if (playerStatus.status != 1) {
return <button type="button" className="btn btn-default" onClick={this.attend}>Sign up</button>
}
}
} else {
return (
<div className="alert alert-warning" role="alert">
<strong>Warning!</strong> You're still active in another tournament, so you can't participate in this one. Finish your other tournament first
before registering.
</div>
)
}
} else {
if (Meteor.players.hasGameTag(Meteor.user()._id, this.data.tournament.game_id)) {
return <button type="button" className="btn btn-default" onClick={this.attend}>Sign up</button>
} else {
return this.noGameTag();
}
}
}
}
},
所以，當頁面呈現和賽簽入相打開並且播放器還未被檢查，我得到這個HTML吐出：
<button type="button" class="btn btn-default" data-reactid=".0.1.1.0.3.0.0.2">Check in</button>
W這是正確的。但是當玩家按下登記按鈕時，他會正確登記，但是我顯示的HTML不會改變登記按鈕。相反，它只是將新結果複製爲新元素，而對舊元素不起作用。
<div class="alert alert-success alert-checkedin" role="alert" data-reactid=".0.1.1.0.3.0.0.2">You have succesfully checked in! Hang on tight, the tournament will start soon!</div>
<button type="button" class="btn btn-default" data-reactid=".0.1.1.0.3.0.0.2">Check in</button>
所以我最終與具有相同reactid，而它應該已經刪除了第一個按鈕，與我的新的div取代它在我的HTML元素。
爲什麼會出現這種情況？這不是發生這種情況的唯一地方，而是最容易記錄的地方。
這可能只是因爲我沒有完全掌握React的做事方式，所以請在需要的地方糾正我！