인프런 커뮤니티 질문&답변
공통 인풋 컴포넌트 구현하기에서 variant가 계속 빨간색 오류뜨는데요;
해결된 질문
작성
·
125
0

import React from 'react';
import { colors } from "@/constants";
import {StyleSheet, TextInput, View,Text, TextInputProps} from 'react-native';
interface InputFieldProps extends TextInputProps{
label?:string;
variant?: "filled" | "standard" | "outlined";
}
function InputField({label, variant = "filled", ...props }: InputFieldProps) {
  return (
    <View>
        {label && <Text style={styles.label}>{label}</Text>}
        <View style={[styles.container, styles[variant]]}>
        <TextInput style={styles.input} {...props} />
        </View>
    </View>
  );
}
const styles = StyleSheet.create({
    container:{
        height:44,
        borderRadius:8,
        paddingHorizontal:10,
        justifyContent:"center",
        alignItems:"center",
    },
    label:{
        fontSize:12,
        color: colors.GRAY_700,
        marginBottom:5,
    },
    filled:{
        backgroundColor: colors.GRAY_100,
    },
    standard: {},
    outline: {},
    input: {
        fontSize:16,
        padding: 0,
        flex:1,
    },
});
export default InputField;
도와주세요,,선생님 ㅠㅠ답변 1
1
Kyo
지식공유자
위에 명시한 variant 타입은 filled, standard, outlined 인데요, 아래 styles에서는 outline 이라고 했기 때문입니다. 똑같이 맞춰주시면 타입에러가 없어질거예요.







선생님 해결되었습니다!! ㅠㅠ
고맙습니다!