Manta UI - newlife-js/Wiki GitHub Wiki

v5부터 form-inline 대신 row col class사용

https://vcalendar.io/?ref=madewithvuejs.com
npm i v-calendar

@main.js

import VCalendar from 'v-calendar';

Vue.use(VCalendar, {
  componentPrefix: 'vc',  // Use <vc-calendar /> instead of <v-calendar />
});

※ methods에서 날짜를 바꿔줘도 달력에서는 적용이 안되는 문제가 있음... range를 computed에 넣고, computed에 들어가는 속성을 바꿔줘야 함...
클릭으로 날짜 바뀔 때 또 에러나서.. computed할 때 setter에서 그 속성까지 바꿔주도록 해줌...
날짜가 바뀌어도, 달력 page가 안바뀜.. :from-page에 month, year 계산해서 넘겨줘야...

참고

참고

vue-star-rating

vue2-google-maps
picker
info window

여러 클래스가 같은 style 가지고 싶을 때는 ,로 연결
.class1, .class2 {}

여러 클래스를 가진 element에 대해서, 클래스1은 가졌지만 클래스2는 가지지 않은 element에 대해서만 style을 적용하고 싶은 경우에는
.class1:not(.class2) { }
:not 앞에 띄어쓰기 넣으면 class1의 자식 element 중 class2가 없는 애들에게 적용되니 주의

ionic.io/ionicons
Unknown custom element라는 warning이 뜸
-> Vue.config.ignoredElements = ['ion-icon'] 추가

<ion-icon name="flash" class="thin"></ion-icon>
<ion-icon name="flash-outline"></ion-icon>
<ion-icon name="flash-sharp" size="large"></ion-icon>

.thin {
  --ionicon-stroke-width: 8px;
}

myElement.focus() // input Tag에 커서 가도록
myElement.scrollIntoView({block:'start'}) // element 위치로 스크롤 이동(스크롤의 시작 위치가)