React Native와 Expo로 만드는 iOS·Android 앱 개발 입문 - 3/3 Kindle판 샘플 앱 수정

나카노히토시씨의 Kindle 책에서 배우는 샘플 어플리케이션은 좀처럼 것으로 공부에도 앞으로 만들려고 하는 어플의 견본도 됩니다만, react-native-elements가 업데이트한 것으로 그대로는 움직이지 않는다.

React Native와 Expo로 만드는 iOS·Android 앱 개발 입문 - 이것 한 권으로 스토어 릴리스까지 진행하는 본격적인 입문서 - 예 FormInput 마지막 기사 에서 쓴 대로.

Avatar


<ListItem> 의 속성으로서 roundAvataravatar={item.user.profile_image_url} 에서는 안 되고, 다음과 같이 쓴다.
<ListItem
    onPress={()=>{this.props.navigation.navigate('WebViewPage', {url:item.url,title:item.title})}
    }
    key={item.id + ":" + item.user.id}
    title={item.title}
    leftAvatar={{
      title: item.title,                           
      source: {uri: item.user.profile_image_url},
      rounded: true
    }   

청취자



샘플 코드에서는 청취되는 함수가 발화하지 않는다.
    componentDidMount() {
        this.props.navigation.addListener('didFocus', this.componentDidFocus()
        this.loadTags();
    }

    componentDidFocus() {
       this.loadTags();
   }

다음과 같이 했다.
    componentDidMount() {
        this.props.navigation.addListener('didFocus', () => this.loadTags()) // 変更。
        this.loadTags();
    }
    /*
    componentDidFocus()を削除
    */    

KeywordForm.js


this.refs["form-input"].clearText()
では動かず
his.refs["form-input"].clear()
で正解
<Input ref="form-input" label="新しく登録するキーワード" onChangeText={this.onChangeInputText} />
でInputのValueを関数に渡せず
<Input ref="form-input" label="新しく登録するキーワード" onChangeText={(text)=>{this.setState({input: text})}} />
渡せた

그 밖에도 있었을까?

일부 자신의 간과도 있다고 생각하지만 일단 수정하고 움직일 수있는 소스 코드를 Github에 올렸기 때문에 참고로.

좋은 웹페이지 즐겨찾기