java根据div的id刷新,更新react Native中的ID元素

我最近开始做反应(和反应本地人一起)，很多事情对我来说都很陌生 . 我正在使用react native创建一个应用程序，它实时显示加密货币 Value .

硬币帽提供Web套接字连接，以便自动更新新值，而不是使用axios获取整个内容 .

现在，在简单的HTML和javascript世界中，我为元素分配了一个ID，并且每当新数据来自web-socket时使用 for loop 来找到我需要更新(或更改)的值 .

像这样的东西

var socket = io.connect('https://coincap.io');

socket.on('trades', function (tradeMsg) {

var crypto = tradeMsg.coin;

for (let i=0; i<500; i++) {

var compare = cryptoSName[i].innerHTML;

if (compare == crypto) {

var oldPrice = document.getElementById('price' + i).innerHTML;

document.getElementById('price' + i).innerHTML= (tradeMsg.message.msg.price.toFixed(4));;

document.getElementById('perc' + i).innerHTML= tradeMsg.message.msg.perc + "%";

document.getElementById('pricer1' + i).innerHTML= (tradeMsg.message.msg.price.toFixed(4));;

document.getElementById('percr1' + i).innerHTML= tradeMsg.message.msg.perc + "%";

var newPrice = tradeMsg.message.msg.price;

[Question] 在反应中，我仍然可以为元素分配一个ID，但是我们如何做这样的事情(使用web-socket来更新数据)？另外，请记住反应组件如何渲染(或重新渲染)事物 .

[Update] 我正在使用Redux，它将数据存储在一个状态中 . 考虑一下

我从redux收到的数据/状态(通过某些动作中的axios api调用)

class cryptoTicker extends Component {

componentWillMount() {

this.props.fetchCoin();

}

render() {

var CryptoData = this.props.cryptoLoaded;

let displayCrypto = CryptoData.map(el => {

return (

key={el["long"]}

coinPrice = {el["price"].toFixed(2)}

/>

);

});

return (

{displayCrypto}

);

}

}

const mapStateToProps = state => {

return {

cryptoLoaded: state.posts.itemsSucess

}

};

export default connect(mapStateToProps, {fetchCoin})(cryptoTicker);

Note ：最初通过axios(ajayx)获取所有数据，websocket仅发送获取数据的更改