본문 바로가기

개발이야기/Vue - Vuetify

(16)
vuetify v-tabs slider 안보이는 버그 페이지 접속 시 v-tabs에 slider가 안보인다면 ref="tabs"를 추가하고 this.$refs.tabs.callSlider(); 추가 하면 오류 해결
[Vue warn]: Failed to resolve directive: ripple 해결 작업중 발견 하게된 오류로 v-simple-checkbox 태그에 :ripple="false" 추가 하여 해결
v-data-table 헤더 변경 ...
자바스크립트 클립보드 복사 안될 때 textCopy: function(text) { return new Promise(function(resolve, reject) { if (text) { const txt = document.createElement("textarea"); document.body.appendChild(txt); txt.value = text; // chrome uses this let sel = getSelection(); let range = document.createRange(); range.selectNode(txt); sel.removeAllRanges(); sel.addRange(range); if (document.execCommand("copy")) { console.log("copied"); } docu..
v-file-input 이미지 사이즈 확인 export default { data: () => ({ mage, }), methods: { imageChange: async function() { if(this.image){ //이미지 파일 크기 체크 let getImageSize = await this.getImageSize(this.image); console.log(getImageSize); /* * 결과 : { width: 100, height: 100 } */ } }, getImageSize : async function(image){ let _URL = window.URL || window.webkitURL; let objectUrl = _URL.createObjectURL(image); return new Promise((resolve..
vue 부모에서 자식 컴포넌트 호출 부모 컴포넌트 자식 컴포넌트 작업중 아래와 같은 오류 발생시 vue Error in created hook (Promise/async) vue Error in mounted hook (Promise/async) mounted: function () { this.$nextTick(function () { // 모든 화면이 렌더링된 후 실행합니다. }) } this.$nextTick 사용시 해결 된다
vuetify v-data-table paging page : 선택 페이지 pageCount : 에 노출될 페이지 버튼 수 viewCount : 에 노출될 리스트 수
Vue filters 사용 예제 {{ price | comma }} import Filters from "@/libs/filters.js"; export default { data: () => ({ price : 1000 }), filters: Filters, }; filters.js파일내용 export default Object.freeze({ comma: (value) => { var len, point, str; value = value + ""; point = value.length % 3; len = value.length; str = value.substring(0, point); while (point < len) { if (str != "") str += ","; str += value.substring(point, po..