전체 글(59)
-
뷰 속성 데이터 바인딩 그리고 mitt라이브러리 사용
그냥 데이터 바인딩 {{데이터}} 속성 데이터 바인딩은 : 속성 ="데이터" 근데 그냥 위에처럼 하면 :속성을 계속 써줘야 해서 오브젝트 형식으로 넣는다 : 속성 = "{ a, b, c, d}" 특히 스타일 같은경우 많이사용 되는데 : style = "{fontSize : '20px, marginTop : '10px'}" 원래 css 에서는 font-size 같이 하이폰으로 연결하는 케밥-케이스를 사용하지만 object에서는 사용이 안되기때문에 camelCase를 사용한다. 또 특히 style에 백그라운드 이미지를 넣는 경우가 많은데 주로 url이 변수로 로 들어오기때문에 '문자' + 변수 + '문자' `문자 ${변수} 문자` 이렇게 사용하면됨 확연히 다르다. 다음으로 들어오는 기능은 cssgram 필터..
2021.10.19 -
Ajax Axios 에 대하여...
에이 찎!쓰! 와 엑시오스에 대해서 Ajax란 Asynchronous JavaScript and XML의 약자입니다. 비동기 통신방식 아~싱크로노스아니네 자바스크립트 and xml 싱크로노스 = 동기 어싱크로노스 = 비동기 서버와 브라우저 간에 비동기 방식으로 자바스크립트와 xml을 주고받는 창을 새로 실행하지 않아도 새로운 정보가 표시 된다구 !! axios = Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리 사람들 어렵게 쓰는거 싫어하잖아 도구 만들어 놓은거임 axios ㅅㄱ. 사용법 ㅈㅅ 설명해드림 axios.get(주소) .then(function(작명데이터)){. ------> 잘받아오면 실행함 console.log(작명데이터) } ...
2021.10.19 -
데이터 관리, 컴포넌트, 프롭스
데이터들이 많이모임 이전시간에는 방대한 양의 데이터는 export import로 관리한다고함 postdata = 엄청길어서 내가 여기 app.vue data(){}칸에 적으면 적다가 콜론 하나 빠져서 오류나고 정신나갈꺼같은 긴 데이터 는 임포트 (아 그걸 기억하셈 ! 왼쪽은 작명 오른쪽은 원래있는거) 게시물(작명) : postdata,(원래있던거) 사실 임포트를 postdata로 안하고 똥강아지로 했으면 게시물 : 똥강아지, 임 왜냐 임포트 당시에는 postdata 위치가 from '경로' 왼쪽이니깐 작명이거든 근데 왠만하면 임포트 작명은 파일명을 따라하셈.. 그게 정신건강에좋음 Container = 보시다시피 컴포넌트임. 마찬가지로 방대한양의 html 덩어리는 component로 관리 근데 컴포넌트를 ..
2021.10.19 -
화면구현 Tip
화면 구현을 할 때 팁은.. 레고 블록 쌓듯이 하라는 것 초보자들이 무턱대고 맨땅에 헤딩 방식으로 하면 절대 절대 절대 절대 절대 할 수 없음.. 정해진 방법이 있고 규칙을 따라야 함 규칙 1. 토대를 먼저 만들고 이후 HTML을 넣어라 방법 1. 큰 박스부터 만들며 작은 박스까지 만들어라 tip : background-color를 주면서 하면 가시적이어서 알아보기 쉽다. 중요성을 모르고 이 단계를 skip한다면 실패함 세미콜론 하나 없어도 안되는게 코드임.. ㅅㄱ..
2021.10.16 -
Vue export import 그리고 GitHub 이미지 활용
data() 의 양이 너무 많으면 문서의 양이 너무 길어짐 그래서 자바구조마냥 문서를 하나 따로 만들고 그걸 첨부(import)하는거임 외부 문서에서는 자기자신을 export 해서 전송 (App.vue) import data(작명) from './oneroom.js파일경로' data(){ return { 원룸들 : data(작명) } } 이런식으로 임포트 시켜줌 data() 위에 명령어 위치 (oneroom.js) export default 위에있던원룸들데이터 이런식으로 익스포트 시켜줌 {{ item }} 상세페이지 상세페이지내용임 닫기 {{ onerooms[i].title }} {{ onerooms[i].price }}만원 허위매물신고 신고수 : {{ count[i] }} 실제로 만든거 만들면서 활용한..
2021.10.15 -
v-if modal UI제작
{{ item }} 상세페이지 상세페이지내용임 닫기 {{ products[0] }} 60만원 허위매물신고 신고수 : {{ count[0] }} {{ products[1] }} 60만원 허위매물신고 신고수 : {{ count[1] }} {{ products[2] }} 60만원 허위매물신고 신고수 : {{ count[2] }} ui 만들떄 공통점 미리 만들어놓고 (HTML CSS 기능JS) 특정 조건이 되면 (v-if 사용 if 특정조건일때만 표현 (v-on:click 등등 event 이되면 특정 값을 바꿔주는것으로 조건형성) 보여준다. 이게끝임
2021.10.15