Question

 case 'splitWord': 
            if(this.props.remedStatus){
                console.log(this.props.remedStatus)
                console.log("remed")
                return(
                   <HotspotRemed 
                        xml={this.receivedXML}
                        userXml={this.usersAnswerXML}
                        correctAnswer ={this.ansString}
                        type={this.splitType}
                    />
                ) 
            } else {
                console.log("reurn word")
                return(
                    
                    <div style ={wrap_style} >
                    {this.forceUpdate}
                        <SplitXMLPreview xml={this.receivedXML}
                            type='w' 
                            assignedSplitContentClick={(contentId, selectionType) => {
                                this.handleSplitContentClick(contentId, selectionType, 'w')
                            }}
                            getCorrectAns={(answers) => {
                                this.correctAnswers = answers
                            }}
                        />
                    </div>
                )
            }
           
            break
            
            
            <<<==NOW HERE IS MY RENDER MEHTOD.==>>>
            
                render() {
        console.log("render")
            return (
                <div className="previewtemplate" style ={template}>
                    {this.templateArea(this.state.templateType)}
                </div>
            );
        
    }
}

我只是想知道如何停止重新渲染组件。

当我点击一个按钮执行此操作时，我有三个按钮。

有一个按钮。其中我使用if if当我点击该按钮时它返回false和组件虚假调用，这是很好的工作，当再次点击该按钮时，它调用真正的组件，这对我来说也很棒，但当我再次点击按钮首先调用render然后调用我的组件。我不想叫它渲染它叫我的compoenent。

我读了一些他们建议使用this.forceupdate的博客。我该怎么办？帮助我。

Answer 1

您可以实现自定义逻辑，以确定组件是否应使用shouldComponentUpdate方法更新（重新呈现）。

例如：

shouldComponentUpdate () {
    return false // this will lead to never re-render the component
}

请注意，将来React可能会将shouldComponentUpdate（）视为提示而不是严格指令，并且返回false仍可能导致重新呈现组件。

Here is a deeper explanation来自文档。

如何停止在reactjs中重新渲染？

1 个答案: