In React, how to render something dynamically and continuously, while leaving other parts running?

I am creating a game in React. Basic description: Sheep images are being ‘fired’ from the center of the screen and they are animated to move to the borders. If they reach it, you lose. If you click on them before, they disappear, and you continue. I have made everything, except the counter which counts how many sheeps you have clicked on. Description code:

<MainComponent  // everything else inside it
  renders <Component creating background/>
          <Component creating sheep images
            renders array of sheep images, with onClick,onAnimationEnd and other props.
                    that array is made of lot of same StyledComponents, in a for loop.
                    every StyledComponent is one sheep image. 
          />
/>

Everything works as I would like. On page load sheeps start firing out of the middle (with specific delay and speed), when I click on them they desappear, when they reach border, game ends. BUT, I don’t know how and where to add <CountScoreComponent/> . I have tried to put it to render in all of the above components, but it either doesn’t update the score, or it updates it but only shows the final score on game end (I want it to change every time I click on a sheep image), or it updates the score and shows it, but then everything re-renders and the whole array of images is recreated and restarted.

So, I understand, that React first creates all components, and it creates the whole array of sheep images immediately. Depending on where I put it it also immediately creates <CountScoreComponent/> with its initial value. How can I update the state of that component (or its return value) dynamically, on every click, but so that at the same time the initial array animation keeps executing (without re-rendering and restarting)?

EDIT: CODE:

EDIT: CODE:

class MainComponent extends React.Component {
render(){
    return (
        <React.Fragment>
            <CreateEnvironment />
            <SheepsStart />                      
        </React.Fragment>
        );
}
}

ReactDOM.render(<MainComponent/>, document.getElementById('root'));

sheepsStart.js

const animDuration = []; //gets populated with 100 random numbers
const positionLeft = []; //positions for KeyFrames, 100 numbers defined by external function call
const positionBottom = [];


export class SheepsStart extends React.Component { 
constructor(props){
    super(props);
    this.state = {gameOver:false};
    this.handleAnimationEnd = this.handleAnimationEnd.bind(this);       
}   
handleAnimationEnd(){
    this.setState({gameOver:true});
}
render(){
    const arrayOfComponents = [];
    for (let index = 0;index<100;index++){
        if(this.state.gameOver === false){
    arrayOfComponents.push(<CreateSheeps src={sheep} alt={`sheep-${index}`} 
            style = {{animationDelay:`${index/2}s`}} left = {positionLeft[index]} bottom = {positionBottom[index]} 
            time = {animDuration[index]} onAnimationEnd = {this.handleAnimationEnd}/>);
        }
        else {
        alert("GAME OVER! ");
        break;
        }
    }
            return (
        <React.Fragment>                        
        {arrayOfComponents}                                 
        </React.Fragment>
    );
}

}

createSheeps.js

export class CreateSheeps extends React.Component { 
constructor(props){
    super(props);
    this.state = {left:this.props.left, bottom:this.props.bottom,    display:'inline'};
    this.handleClickAnimation = this.handleClickAnimation.bind(this);                 
}    
handleClickAnimation(){
    this.setState({display:'none'});
}     
render(){        
    const sheepWantsToEscape = keyframes`
    100% {
      left:${this.state.left}%;
      bottom:${this.state.bottom}%;
    }
    `        
    const CreateSheeps = styled.img`
    //some data
    `

    return (
    <React.Fragment>
    <CreateSheeps src = {this.props.src} style = {this.props.style} 
        onClick = {this.handleClickAnimation} onAnimationEnd = {this.props.onAnimationEnd}/>         
    </React.Fragment>   
    )  
}

Without knowing your code, a bit hard to tell, but I think you could achieve that with shouldComponentUpdate lifecycle method:

I`ll try to edit question and put some shorter version of the code