第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

帶有主題 HOC 的樣式組件不適用于 React.FC 類型

帶有主題 HOC 的樣式組件不適用于 React.FC 類型

狐的傳說 2021-12-02 16:00:34
我正在使用 React.FC 打字稿構建一些組件,今天我在嘗試使用樣式組件中的withThemeHOC注入樣式組件道具時發(fā)現了這個打字稿錯誤:似乎withThemeHOC 只接受React.ComponentType作為參數,但組件是使用React.FC(Functional Component)構建的。有沒有辦法投射React.FC到React.ComponentType?更新完整的組件實現:import React, { useEffect } from 'react'import PropTypes from 'prop-types'import { Reset, LoadingBarStyled, SpinnerContainer } from './Style'import { withTheme } from 'styled-components'import ScaleLoader from 'react-spinners/ScaleLoader'export interface ILoadingBarComponent {    progress: number    appearance?: string    onFinish(finished: Promise<string>): void}const LoadingBarComponent: React.FC<ILoadingBarComponent> = ({    progress = 0,    appearance = 'default',    onFinish}) => {    useEffect(() => {        if (progress >= 100 && onFinish) {            onFinish(                new Promise((resolve, reject) => {                    setTimeout(() => {                        resolve('finished')                    }, 800)                })            )        }    }, [progress, onFinish])    return (        <div className="loading-bar-component-module">            <Reset />            {progress > -1 && progress < 101 && (                <>                    <LoadingBarStyled progress={progress} appearance={appearance} />                    <SpinnerContainer progress={progress}>                        <ScaleLoader height={10} />                    </SpinnerContainer>                </>            )}        </div>    )}LoadingBarComponent.propTypes = {    progress: PropTypes.number.isRequired,    appearance: PropTypes.string,    onFinish: PropTypes.func.isRequired}export default withTheme(LoadingBarComponent)
查看完整描述

1 回答

?
鴻蒙傳說

TA貢獻1865條經驗 獲得超7個贊

你需要在theme你的組件 props 接口中添加一個prop:


interface Theme {}


export interface ILoadingBarComponent {

  progress: number

  appearance?: string

  onFinish(finished: Promise<string>): void

  theme: Theme

}


查看完整回答
反對 回復 2021-12-02
  • 1 回答
  • 0 關注
  • 189 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號