daum post

react-daum-post

주소검색을 하고싶었는데 daum것을 많이 쓰는거같고 깔끔해해서 사용했다. 웹뷰로 사용하는 방법도 있는데, 라이브러리가 있어 일단은 라이브러리로 사용했다. reac-daum-post 를사용하는데 react native 에선 잘안되는거같아 찾아보니 rn에서 사용이되는걸 찾았다. 물론 내 착각일수도있다.

설치

npm install @actbase/react-daum-postcode

or

yarn add @actbase/react-daum-postcode

RN 작업용으로 webView 추가 설치

npm install react-native-webview
npx pod-install

사용

import Postcode from '@actbase/react-daum-postcode';

 return (
    <View style={styles.container}>
      <HeaderBack2 title={'주소 검색'}></HeaderBack2>

      <View style={styles.content}>
        <TouchableOpacity onPress={handleMyLocation} style={styles.mylocation}>
          <Text>현재 위치로 설정</Text>
        </TouchableOpacity>
        {/* <View>
          <Text>내 위치 설정하기</Text>
        </View> */}
        <View>
          <Postcode
            style={styles.postcode}
            jsOptions={{ animation: true }}
            onSelected={(data) => {
              getSearchAddress(data)
            }}
          />
        </View>
      </View>
    </View>
    // </View>
  )
}

on selected로 주소를 클릭하면 주솟값을 받아온다.
jsOpiton animation을주면 주소를 입력했을때 주르륵 나오는 효과를 준다.

출처: https://github.com/actbase/react-daum-postcode

https://velog.io/@jjung-developer/ReactReactNative-%EC%B9%B4%EC%B9%B4%EC%98%A4-%EC%A3%BC%EC%86%8C-%EA%B2%80%EC%83%89-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-%EC%9D%B4%EC%9A%A9%ED%95%98%EA%B8%B0-react-daum-postcode