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

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

TypeScript 說一個(gè)字符串是無效的,即使它在聯(lián)合中?

TypeScript 說一個(gè)字符串是無效的,即使它在聯(lián)合中?

至尊寶的傳說 2022-10-08 15:14:01
我從 AWS Amplify 教程中復(fù)制了以下內(nèi)容:const styles = {  container: { flexDirection: 'column' },  ...};<div style={styles.container}>但我得到:Type '{ flexDirection: string; }' is not assignable to type 'CSSProperties'.  Types of property 'flexDirection' are incompatible.    Type 'string' is not assignable to type '"column" | "inherit" | "-moz-initial" | "initial" | "revert" | "unset" | "column-reverse" | "row" | "row-reverse" | undefined'.我可以通過將樣式內(nèi)聯(lián)來輕松解決這個(gè)問題,但我很好奇為什么 TypeScript 認(rèn)為這是一個(gè)錯(cuò)誤。這是一個(gè)非?;镜睦?,我很驚訝 TS 在它上面失敗了,所以它讓我對(duì)使用 TS 保持警惕。
查看完整描述

3 回答

?
慕蓋茨4494581

TA貢獻(xiàn)1850條經(jīng)驗(yàn) 獲得超11個(gè)贊

這是一個(gè)TS Playground,說明了問題和四種可能的解決方案:

type FlexDirection = "column" | "inherit" | "-moz-initial" | "initial" | "revert" | "unset" | "column-reverse" | "row" | "row-reverse" | undefined;


type Styles = {

    container: {

        flexDirection: FlexDirection

    }

}


function doStuff(a: Styles) { }


const stylesDoesNotWork = {

    container: { flexDirection: 'column' }

};


const stylesWithCast = {

  container: { flexDirection: 'column' as 'column' }

}


const stylesFieldConst = {

    container: { flexDirection: 'column' } as const

};


const stylesConst = {

    container: { flexDirection: 'column' }

} as const;


doStuff(stylesDoesNotWork);

doStuff(stylesWithCast);

doStuff(stylesFieldConst);

doStuff(stylesConst);

默認(rèn)情況下,TypeScript 將為string您聲明的對(duì)象推斷類型。您可能會(huì)在某處對(duì)其進(jìn)行變異并更改值,在這種情況下,文字類型將不正確。因此,修復(fù)它的基本選項(xiàng)是:

  • 手動(dòng)注釋變量,以便 TypeScript 不會(huì)推斷字符串。

  • 添加as 'column'cast 以告訴 TypeScript 使用文字類型。

  • 在字段或整個(gè)對(duì)象上使用as const來告訴 TypeScript 不允許更改字段,這允許 Typescript 推斷文字值。


查看完整回答
反對(duì) 回復(fù) 2022-10-08
?
拉莫斯之舞

TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超10個(gè)贊

嘗試這個(gè)


const styles: { container: React.CSSProperties} = {

    container: { flexDirection: 'column' }

};


查看完整回答
反對(duì) 回復(fù) 2022-10-08
?
郎朗坤

TA貢獻(xiàn)1921條經(jīng)驗(yàn) 獲得超9個(gè)贊

導(dǎo)入并使用類型:

import type { Property } from 'csstype'

使用 Property.FlexDirection 指定類型


查看完整回答
反對(duì) 回復(fù) 2022-10-08
  • 3 回答
  • 0 關(guān)注
  • 169 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)