本稿について
本稿はサイト運営者が学んだことなどを記したメモの内容です。
全てが正確な情報とは限りません。ご注意ください。また修正するべき点は適時修正していきます
全てが正確な情報とは限りません。ご注意ください。また修正するべき点は適時修正していきます
#vue
自前で用意するのが面倒だったのでこれを使う
$ npm install vue-ctk-date-time-picker --save
cssもインポートしないいけないのが少しダサい
import Datetime from "vue-ctk-date-time-picker";
import "../../node_modules/vue-ctk-date-time-picker/dist/vue-ctk-date-time-picker.css";
<Datetime
v-model="start_at"
:minute-interval="5"
:format="'YYYY-MM-DD HH:mm’”
:label="dateTimeLabel"
:overlay="true"
:min-date="start"
:max-date="end"
></Datetime>
min-dateなどのデータは “computed” や “watch” などを利用して設定する
computed: {
start() {
const start = moment();
return start.format("YYYY-MM-DDTHH:mm:ss");
},
end() {
const start = moment(this.start);
const end = start.add(3, "months").endOf("day");
return end.format("YYYY-MM-DDTHH:mm:ss");
},
dateTimeLabel() {
return "予定日"
}
}