생각은 길게 코딩은 짧게

TextInput에 모든 값이 입력되지 않았을 경우에 버튼을 비활성화 TextInput에 모든 값이 입력되었을 경우엔 버튼을 활성화 시켜보았습니다. 글자 수 제한을 구현했을 때 사용했던 삼항연산자를 사용하여 처리해주었습니다. 삼항연산자에 대해 자세한 설명이 필요하시면 요 포스팅을 보시면 됩니다 [React-Native] 글자 수 제한하기 리스트의 값들을 뿌려주는 중 해시태그의 길이가 늘어나면서 글이 레이아웃을 침범해버리는 현상이 나타났다 ! ✅ slice 함수 사용하기 배열로부터 특정 범위를 복사한 값들을 담고 있는 새로운 sayhee.tistory.com ✅ 삼항연산자 사용 {/* 상품 등록하기 버튼 부분*/} {this.state.number.trim() != 0 && this.state.name.t..

상품 리스트를 보다 상품등록을 원할 때 바로 갈 수 있게 플로팅 버튼을 구현해보았습니다! ✅ Plus 아이콘 ( AntDesign) 사용 import Icons from 'react-native-vector-icons/AntDesign'; ✅ stack class에 이동할 페이지 선언 ( AddGoods) class Stack extends Component { render() { return ( ); } } ✅ 버튼 클릭 시 상품등록 페이지로 이동 {this.props.navigation.navigate("AddGoods")}}> 💡 onpress={this.props.navigation.navigate("AddGoods"} 방식으로 할 경우 Warning: Cannot update a componen..

독감으로 앓는다고 일주일 쉬었따...ㅠㅠ (꿀맛 같았음) 다들 추운데 감기 조심하세요 사업자번호 사진을 찍으면 번호가 따와져 그 값을 바로 TextInput에 자동으로 들어가도록 구현했습니다 ✅ navigation.navigate함수의 두 번째 매개 변수로 객체에 매개 변수를 넣어 경로에 매개 변수를 전달 this.props.navigation.navigate('SignUp',{companyNo:this.state.companyNo}); //TextInput에 나타내주기 위해 사업자번호 보내줌 ✅ initialParams 속성을 사용하여 기본값 지정 ✅ props가 업데이트 되면 받아온 값들을 저장 ( 사업자번호 사진 & 사업자번호 ) - react 문서를 참고하였습니다 componentDidUpdate..

로그인을 한번 했다면 다시 앱에 들어갔을 때 자동 로그인이 되어야 User들이 로그인을 계속 해야되는 귀찮음을 덜어드릴 수 있겠죠?! 그래서 구현해보았습니다. ✅ AsyncStorage에 대하여 AsyncStorage는 리액트 네이티브에서 사용할 수 있는 key-value 형식의 저장소다. 웹에서 사용하는 LocalStorage와 같은 기능을 한다고 생각하면 편한데, localstorage와 차이점은 AsyncStorage는 비동기적으로 작동한다는 것이다. 쉽게 말하면 React Native에서 어떤 값을 오프라인에(디바이스 자체) 저장하고 싶을 때 쓰는 패키지이다. ✅ AsyncStorage Install Installation | Async Storage Install react-native-asyn..

🔻 로그인 버튼을 눌렀을 때 아이디 비밀번호가 DB에 없을 경우 오류메시지와 함께 비밀번호 값을 비워보았따 ✅ React.createRef() this.passwordRef = React.createRef(); ✅ 조건문 걸어주기 if(response.id == "0" ) { this.setState({ confirmreg : false }); this.passwordRef.clear(); return false; } 로그인 정보가 서버에 없을 경우 제가 받는 response message가 {id: 0} 이므로 id 값이 0일 경우에 오류 메시지와 함께 비밀번호 창을 비우게 해주었습니다. 💡 결론 : 비밀번호 창을 비우는 코드는 이것 ! this.passwordRef.clear();

로그인을 할 때 비밀번호를 보이지 않게 별표로 표시하고싶을 때 !! ✅ secureTextEntry의 값을 true로 설정해주기 간단하게 설정할 수 있답니다 :)

노트북에서 벗어나 데스크탑으로 바꾸면서 환경설정을 처음부터 다시했어요 믿고 따라오시면 30분도 안걸릴 것임!! 예전에 한 환경설정이 매우 복잡한 것을 확인하고 다시 포스팅 하였습니다 ! ✅ jdk 11버전 설치 및 환경설정 💡 오라클에 들어가서 조금만 내리다 보면 11버전이 있습니다 로그인 후 jdk가 다운이 됩니다 Download the Latest Java LTS Free Subscribe to Java SE and get the most comprehensive Java support available, with 24/7 global access to the experts. www.oracle.com ✅ 환경설정을 위해 자바 경로로 이동해줍니다 ( 경로 ctrl + c ) ✅ 시스템 속성 > 환경변..

상품등록 후 홈의 등록 된 상품 리스트 화면에서 등록 된 상품들이 갱신이 되기 위해 Refresh 기능이 필요하였다 constructor(props){ this.state={ refreshing : false } } - 초기 렌더링 시에는 사용자로부터 refresh 이벤트를 받지 않았음으로 false로 지정 //데이터 가지고오는 함수 _getData = () => { this.callGetRepairAPI().then((response) => { this.Contents = response; this.setState({ goodsContent: response }); }); console.log('refresh success') this.setState({ refreshing: false }) } - 새..