본문 바로가기

전체 글72

[React] Link로 파라미터 넘기기 버전 node : 18.7.0 react-router-dom : 6.3.0 react-router-dom 버전이 6.x 버전으로 올라가면서 react-router-dom에 사용할 수 있던 Switch를 더 이상 사용할 수 없게 됐다. 그래서 Switch를 대신해 Routes를 사용할 수 있다. Link로 값 넘기기 페이지 별로 값을 넘겨야 하는 경우가 있다. 그런 경우엔 react-router-dom의 Link를 통해 값을 넘길 수 있다. 값을 react-router-dom의 버전 6버전 이전에는 Link의 속성 중 to 변수안에 지정할 수 있었지만 지금은 state변수가 있어서 state에 넘길 값을 담으면 된다. {item.title} to : 이동할 경로 state : 이동할 페이지에 넘길 값 Li.. 2022. 11. 27.
SwiftUI를 이용한 탭 메뉴 만들기 (TabView) 상단의 메뉴바를 이용하여 화면이 전환되게 하는 View를 SwiftUI 에서는 TabView 를 제공한다. 기본 코드 struct FirstView: View { var body: some View { VStack { Text("First View") } } } struct SecondView: View { var body: some View { VStack { Text("Second View") } } } struct ContentView: View { var body: some View { TabView { FirstView() .tabItem { Image(systemName: "house") Text("Home") } SecondView() .tabItem { Image(systemName: "p.. 2022. 11. 26.
SwiftUI를 이용한 여러 줄의 텍스트를 입력하기 (TextEditor) 글을 입력할 때 여러 문장으로 이루어진 장문을 써야하는 경우도 있다. 그럴때는 SwiftUI 에서는 TextEditor 뷰를 이용해 장문의 글을 입력 및 나타낸다. 기본 코드 struct ContentView: View { @State private var text: String = "Enter some text" var body: some View { VStack { TextEditor(text: $text) .padding() .foregroundColor(Color.black) .font(.custom("원하는글꼴", size: 20)) .lineSpacing(5) // 줄 간격 .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: 3.. 2022. 11. 25.
SwiftUI를 이용한 텍스트 입력하기 (TextField) UI를 그리다보면 사용자가 입력해야하는 부분이 생긴다. 그럴때 사용하는 뷰가 TextField란 뷰를 이용해 사용자가 값을 입력하게 한다. 기본코드 import SwiftUI struct ContentView: View { @State private var name = "" var body: some View { VStack { TextField("이름", text: $name) .padding() Text("당신의 이름은 \\(name) 입니다.") } } } 실행화면 속성 NumberFormatter : 숫자를 표시하기 위해 사용하는 포맷 KeyboardType : 키보드의 종류를 설정 .default .decimalPad : 숫자 키패트 설정 .asciiCapable : ASCII 코드 문자를 입력.. 2022. 11. 24.

\