微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

ReactJS Owlcarousel不会更新项目文本值

如何解决ReactJS Owlcarousel不会更新项目文本值

我正在制作一个reactjs应用程序,该应用程序的登录页面上有一个猫头鹰传送带,我面临的问题是,每当我使用i18n更改语言时,使用changeLanguage(lng)都会更新每个文本,除了owlCarousel中的那个..有什么解决办法吗?

我想提一提,当我再次单击语言更改(第二次)时,它会正确更改,但是再次,切换到下一种语言也需要单击两次,只是重新显示猫头鹰传送带项。

<OwlCarousel
                items={this.state.items}
                loop
                autoplaySpeed={700}
                navSpeed={700}
                dotsspeed={700}
                lazyLoad
                lazyContent
                // autoplay
                autoRefresh
                nav
                navText={["<i class='far fa-chevron-left fa-2x'></i>","<i class='far fa-chevron-right fa-2x'></i>"]}
                ref={(el) => { this.slider = el; }}
                autoplayTimeout={4000}

            >

            <header className="masthead">
            <picture>
              <source srcSet="../assets/img/slider1.jpg" type="image/jpg" />
              <source srcSet="../assets/img/slider1.jpg" type="image/jpg" />
              <img className="img-fluid" src="../assets/img/slider1.jpg"style={{position: 'absolute',filter: 'brightness(100%)',top: '0px',width: '100%',minHeight: "100%",height: "-webkit-fill-available",objectFit: 'cover',backgroundColor: 'white'}}  alt="links" />
            </picture>
              <div id="carouselExampleIndicators"  className="carousel slide" data-ride="carousel">

                <div className="row">
                <div className="col-md-12">
                  <div className="carousel-item active">
                    <div className="container">
                     <div className="masthead-heading text-uppercase" style={{ width: '70%',fontSize: '5vh',letterSpacing: '0.3rem',lineHeight: '4.2rem'}}>**{i18n.t('Slider2Sub')}**<br />{i18n.t('Slider2Head')}</div>
                      <a className="btn btn-primary btn-xl text-uppercase js-scroll-trigger" href="#services">{i18n.t('MoreBtn')}</a>
                    </div>
                  </div>
                  </div>

                  </div>
                </div>

            </header>
</OwlCarousel>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。