私は本当に反応して、還元開発に新しいです。私は、コンテナに接続されているリストコンポーネントを持っています。私は、スクロールのリストを更新したいが、私は得る:同じキーを持つ2人の子供が遭遇しました
Encountered two children with the same key
マイコンポーネント:状態を更新
import React, { Component, PropTypes } from 'react'
import Track from './Track'
import styles from './TrackList.css'
const altImg = require('../images/sc.jpg');
export default class TrackList extends Component {
static propTypes = {
tracks: PropTypes.arrayOf(PropTypes.shape({
id: PropTypes.number.isRequired
}).isRequired).isRequired,
onTrackListScroll: PropTypes.func.isRequired
}
render() {
const { tracks, onTrackListScroll } = this.props;
return (
<div>
<ul className='tracks'
onScroll={(e)=>{
console.log('SCROLL!!',e)
onTrackListScroll()
}}>
{tracks.map(track =>
<Track
key={track.id}
{...track}
//onClick={() => onTrackClick(track.id)}
text={track.title}
imgSrc={!track.artwork_url ? altImg : track.artwork_url}
/>
)}
</ul>
</div>
)
}
}
減速は、次のとおりです。コンポーネントを更新するための正しい方法は何ですか
const toSearchResultOb = (tracks) => {
return {
tracks: tracks
}
}
case 'UPDATE_SEARCH_RESULT':
return Object.assign({}, state,
toSearchResultOb(state.tracks.concat(action.tracks)))
onScroll with redux?
実際には、私は残りのapi(soundcloud)のデータをページネーションで取得しています。(私は推測すると)キーはユニークです。私は反応還元国で何かを台無しにする可能性はありますか? –
まだレンダリングに問題があります。壊れているようです –
まだ問題は解決していませんか?これまでに何ができるのですか? – Chris