2017-04-05 5 views
0

내가 할 노력하고 무엇실패 소품 유형 : 잘못된 소품 값의 'keyboardType'- ReactNative

Warning: Failed prop type: Invalid prop 'keyboardType' of value "supplied to 'TextInput' expected one of ["default", "email-address", etc]

라는 경고를 보내고있어 선택한 dropdown에 따라 keyboardType을 변경됩니다.

잘 작동하지만이 오류가 계속 발생합니다. 내가 뭘 잘못하고 있는지 모르겠다. 나는 아직도 React와 ReactNative에 익숙하지 않습니다. 만약 누군가가 어떻게 작동 하는지를 설명 할 수 있으면 저에게 어떻게해야하는지 예제를 알려 주면 정말 감사하겠습니다.

여기

import ModalDropdown from 'react-native-modal-dropdown'; 

const types = ['Phone', 'Email Address', 'Name', 'Address']; 
export default class SampleComponent extends Component{ 
constructor(props) { 
super(props); 
this.state = { 
    dataInput: '', 
    typeOfKeyboard: '', 
}; 
} 

// this is how I set the state to be inputed in my `keyboardType` props 
typeSelectedOnSelect(id, value) { 

if(value== 'Phone'){ 
    this.setState({typeOfKeyboard: 'numeric'}); 
}else if(value== 'Email Address'){ 
    this.setState({typeOfKeyboard: 'email-address'}); 
}else{ 
    this.setState({typeOfKeyboard: 'default'}); 
} 
} 

render(){ 

<View style={{flexDirection: 'column', flex: 1, padding: 20}}> 
        <Text style={styles.contactTypeText}>Contact Type</Text> 
        <ModalDropdown 
           options={types} 
           onSelect={this.contactTypeOnSelect.bind(this)} 
           style={styles.dropdownContainer} 
           dropdownStyle={styles.dropdownStyle} 
           textStyle= {styles.dropdownText} 
        /> 

    <TextInput label="Type anything" keyboardType={this.state.typeOfKeyboard} onChangeText={(dataInput)=>this.setState({dataInput})} value={this.state.dataInput} /> 
       </View> 

이 도움을 주셔서 감사합니다 내 코드입니다!

답변

1

typeOfKeyboard의 초기 상태가 비어 있기 때문에.

'default'로 변경하거나 null을 전달하십시오. docs

keyboardType? ENUM ('기본', '이메일 주소', '숫자', '폰 패드', '아스키 지원', '수 - 문장 부호'에서 , 열 키보드 'URL', '숫자 패드', '이름 전화 패드', '진수 패드', '트위터', '웹 검색')

를 결정, egnumeric.

다음 값

플랫폼에서 작동 :

기본 숫자 이메일 주소 전화 패드를

을 '?' 필요 없음을 나타냅니다.

+1

내게 연락해 주셔서 감사합니다. 나는 더 이상 경고를받지 않습니다. – natsumiyu

+0

그레이트 :). 다행스럽게 도울 수있어! – WilomGfx

-1

{some expression}이 (가) 객체이지만 this.state.typeOfKeyboard는 string이기 때문에 keyboardType={this.state.typeOfKeyboard} 대신 keyboardType=this.state.typeOfKeyboard을 사용해야합니다. 시도해 볼 수 있습니다.

+0

{}을 사용하고 this.state 만 사용한 것과 다른 점은 무엇입니까? – natsumiyu

+0

질문에 답하기 전에 무엇을 말하고 있는지 알아주십시오. 객체가 아니라 JSX가 데이터를 출력하는 방식입니다. 각도와 마찬가지로 {{}} 할 수 있습니다. – WilomGfx

+0

https://facebook.github.io/react/docs/jsx-in-depth.html#javascript-expressions – WilomGfx