[英]Why does my react component keep re-rendering?
I'm trying to embed a tockify calender into a component, within a react project I'm building.我正在尝试将一个 tockify 压延机嵌入到一个组件中,在我正在构建的一个反应项目中。 I should note that I'm using a library called react-script-tag that allows me to use
<script/>
tags within my component.我应该注意,我正在使用一个名为 react-script-tag 的库,它允许我在我的组件中使用
<script/>
标签。 Anyway, the calender is rendering - but then keeps on re-rendering as if it's stuck in some sort of loop.不管怎样,压延机正在渲染——但随后继续重新渲染,就好像它卡在某种循环中一样。 I have a feeling I need to implement some sort of lifecycle method.
我觉得我需要实施某种生命周期方法。 Any suggestions?
有什么建议么? Code as follows:
代码如下:
import React from 'react'
import Nav from './Nav'
import ScriptTag from 'react-script-tag'
class Events extends React.Component {
render() {
return (
<div>
<Nav/>
<div data-tockify-component="calendar" data-tockify-calendar="hzevents2"></div>
<ScriptTag isHydrating={false} data-cfasync="false" data-tockify-script="embed" src="https://public.tockify.com/browser/embed.js"></ScriptTag>
</div>
)
}
}
export default Events
The documentation of 'react-script-tag' says 'react-script-tag' 的文档说
It is recommended that the Script tag is placed in a component that only renders once in the entire life of your app.
tag will be appended each time the component mounts again.建议将 Script 标签放置在应用的整个生命周期中只呈现一次的组件中。 Otherwise, a new
否则,一个新的
每次再次安装组件时都会附加标签。 There are plans down the road to prevent this.
未来有计划来防止这种情况发生。
You may want to use a pure component to prevent rerendering.您可能希望使用纯组件来防止重新渲染。
Edit: Regardless of my answer you should show the rest of your code to be able to detect the problem.编辑:无论我的回答如何,您都应该显示代码的 rest 以便能够检测到问题。
Use React.PureComponent instead of React.Component because of React.PureComponent will prevent to re-rendering if there is no need or update.使用 React.PureComponent 而不是 React.Component,因为 React.PureComponent 将在不需要或更新时阻止重新渲染。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.