Typescript: TS2322 : ' "μ ˆλŒ€"μœ ν˜•μ—'λ¬Έμžμ—΄ 'μœ ν˜•μ„ 지정할 수 μ—†μŠ΅λ‹ˆλ‹€. | "μƒλŒ€μ "| μ°ΎμœΌμ‹œλŠ” μ£Όμ†Œκ°€ μ—†μŠ΅λ‹ˆλ‹€'

에 λ§Œλ“  2016λ…„ 10μ›” 09일  Β·  3μ½”λ©˜νŠΈ  Β·  좜처: microsoft/TypeScript

TypeScript 버전 : 2.1.0-dev.20161008

문제λ₯Ό μ„€λͺ…ν•˜κΈ°μœ„ν•œ μ΅œμ†Œ ReactNative ꡬ성 μš”μ†Œ :

import React, { Component } from 'react';
import { StyleSheet, Text } from 'react-native';

export class Sample extends Component<{}, {}> {
    render() {
        return (
            <Text style={styles.text}>Hello TypeScript</Text> // error on styles, see below
        );
    }
}

const styles = StyleSheet.create({
    text: {
        position: 'absolute', // cause of the error: string instead of 'absolute'
        top: 0,
        left: 0     
    }
});

였λ₯˜:

error TS2322: Type '{ position: string; top: number; left: number; }' is not assignable to type 'TextStyle | undefined'.
  Type '{ position: string; top: number; left: number; }' is not assignable to type 'TextStyle'.
    Types of property 'position' are incompatible.
      Type 'string' is not assignable to type '"absolute" | "relative" | undefined'.

λ°˜μ‘ ν˜• 선언이 λ¬Έμžμ—΄μ„ μ‚¬μš©ν•˜μ§€ μ•Šκ³  κ°€λŠ₯ν•œ λ¬Έμžμ—΄ 집합 만 ν—ˆμš©ν•œλ‹€λŠ” 점이 λ§ˆμŒμ— λ“­λ‹ˆλ‹€.

TypeScriptκ°€ 이것을 'μ ˆλŒ€'μœ ν˜•μœΌλ‘œ μΆ”λ‘ ν•˜λ„λ‘ν•˜λŠ” 방법이 μžˆμŠ΅λ‹ˆκΉŒ?
이 position ν•„λ“œλ₯Ό 읽기 μ „μš©μœΌλ‘œ ν‘œμ‹œ ν•  수 μžˆλ‹€λ©΄ 'absolute'μœ ν˜•μœΌλ‘œ μΆ”λ‘  ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

# 10676κ³Ό 관련이 μžˆμŠ΅λ‹ˆκΉŒ?

Question

κ°€μž₯ μœ μš©ν•œ λŒ“κΈ€

λ‚˜λŠ” μΊμŠ€νŒ…μ„ μ’‹μ•„ν•˜μ§€ μ•ŠμœΌλ©° κ°€λŠ₯ν•œ ν•œ λ°©μ§€ν•˜μ§€ μ•Šμ§€λ§Œ ν•΄κ²° 방법은 λ‹€μŒκ³Ό κ°™μŠ΅λ‹ˆλ‹€.

const styles = StyleSheet.create({
    text: {
        position: 'absolute',
        top: 0,
        left: 0     
    } as React.TextStyle // cast to existing interface
});

내보낼 μΈν„°νŽ˜μ΄μŠ€κ°€μ—†λŠ” 경우 (μ—¬κΈ° : TextStyle), ν•„λ“œ 만 μΊμŠ€νŒ… ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

const styles = StyleSheet.create({
    text: {
        position: 'absolute' as 'absolute', // cast string to type 'absolute'
        top: 0,
        left: 0     
    }
});

λͺ¨λ“  3 λŒ“κΈ€

λ‚˜λŠ” μΊμŠ€νŒ…μ„ μ’‹μ•„ν•˜μ§€ μ•ŠμœΌλ©° κ°€λŠ₯ν•œ ν•œ λ°©μ§€ν•˜μ§€ μ•Šμ§€λ§Œ ν•΄κ²° 방법은 λ‹€μŒκ³Ό κ°™μŠ΅λ‹ˆλ‹€.

const styles = StyleSheet.create({
    text: {
        position: 'absolute',
        top: 0,
        left: 0     
    } as React.TextStyle // cast to existing interface
});

내보낼 μΈν„°νŽ˜μ΄μŠ€κ°€μ—†λŠ” 경우 (μ—¬κΈ° : TextStyle), ν•„λ“œ 만 μΊμŠ€νŒ… ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

const styles = StyleSheet.create({
    text: {
        position: 'absolute' as 'absolute', // cast string to type 'absolute'
        top: 0,
        left: 0     
    }
});

이것은 https://github.com/Microsoft/TypeScript/pull/19966 κ³Ό 관련이

λ‹€μŒκ³Ό 같은 경우 일 μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€. https://github.com/Microsoft/TypeScript/issues/21618#issuecomment -362945112

이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰