개발중/Vue.js (52) 썸네일형 리스트형 el-table column align el - table 을 이용하는데 부장님 요구사항이 들어왔다. 테이블을 만들 때는 아래처럼 정렬 할 것 ! Header 는 center 로 Data 는 left 객체 배열에서 특정 값 추출 특정 키 값으로 새로운 배열 리턴 (lodash 라이브러리 활용) 여러개의 객체 배열 (checkList) 이 있을 때 배열마다 특정 값 (seq) 이 있다고 치자. 배열의 특정 seq 만 가지고 와서 객체 배열을 문자열 배열 (seq) 을 생성하려고 한다. 그때 사용 할 것 let newList = _.map( checkList , 'seq') vue el-date-picker Format ✅ el-date-picker Format el-date-picker 시키는 법 format="yyyy-MM-dd" value-format="yyyy-MM-dd" 에러 어제는 잘 실행이 되더니 오늘은 이런 현상이 발생한다. 분명히 설정은 같은데 하나는 format 이 잘되고 두개는 format 이 되지 않는다니 당황스럽다. 해결 문제는 여기서 발생했다. 애초에 Defalut 값을 new Date() 로 했을 경우에 표준 Format 으로 들어가는 것이다. 사용자가 애초에 Date 를 선택할 수 있도록 undefinedf 해주는 것이 중요할 것 같다. v-for 문 v-model 동적 다루기 vue 를 다루다가 v-for 문을 사용할 일이 많은데 동적으로 v-model 을 정의할 일이 많았다. testModel : {} 아래처럼 v-model 을 동적으로 다룰 수 있다. vue - api 랑 통신하기 vue 에서 api 호출하는 법 정리 지금 내가 사용하는 방법은 vue 와 java 를 분리해서 서버를 띄어 놓은 후에 서로 통신하는 방법이다. ✅ Controller 를 켜주고 vue 도 서버를 켜주자 ✅ 아래와 같이 폴더구조가 되어 있다. ✅ api 아래에는 axios 가 정의되어 있을 것이다. ✅ views 에는 vue 파일이 정의 되어 있을 것이고 ✅ 어떤 버튼 클릭 이벤트가 발생했을 때 호출하는 것으로 예시를 들어보자. ✅ @/api/binsoo js 파일에 Binsootest1, Binsootest2 가 존재 해야 해. import { Binsootest1, Binsootest2 } from '@/api/binsoo' methods: { async Binsoo (){ await Binsoote.. vue excel 다운로드 - blob Download ✅ js blobDownload 공통 js 파일에 아래와 같은 bolbDownload 파일을 만든다. 더보기 export function blobDownload(response){ // 1. blob URL 생성 var contentTypeHeader = response.data.type; var blobURL = window.URL.createObjectURL(new Blob([response.data], { type: contentTypeHeader })) // 2. fileName response 헤더에서 불러오기 var fileName = response.headers['content-disposition'].match(/filename="(.+)"/)[1] //인코딩 해서 온 파일 이름을 디코딩.. vue post (insert ) vue 에서 insert 할 때는 FormData 를 생성해서 데이터를 실어 보내줘야 한다. 이유는 post 를 할 때에는 headers - ContentType 이 'application/x-www-form-urlencoded' 이기 때문이다. 더보기 export function insertLearning(data){ const frm = new FormData() frm.append('mmtSeq', data.mmtSeq) frm.append('tdiSeq', data.tdiSeq) frm.append('mmiName', data.mmiName) return request({ url: '/api/machine-learning', method: 'post', headers: {'Content-Type'.. 드래그 앤 드랍 기능 참고 사이트 기록 드래그 앤 드랍 기능을 개발하기는 했는데 개발 전에 알았다면 좋았을 것같은 사이트 기록 여기 이전 1 2 3 4 5 6 7 다음
