flatpickr - にほんご。

Getting Started

インストール

モジュール環境

flatpickrはnpmboweryarnといったパッケージマネージャからインストールすることで、 常に最新の状態を維持することができます。

# npmでのインストール
npm i flatpickr --save
 
# bowerの場合
bower install flatpickr-calendar --save
 
# もしyarnの方が良いなら
yarn add flatpickr

非モジュール環境

パッケージマネージャが利用出来ない場合は、unpkgから取得して使うことが出来ます。

<link rel="stylesheet" href="https://unpkg.com/flatpickr/dist/flatpickr.min.css">
<script src="https://unpkg.com/flatpickr"></script>

使い方

モジュール環境

パッケージをrequireして使うのが良いでしょう。

const flatpickr = require("flatpickr");

そして、以下の方法でflatpickrのインスタンスを生成できます。

flatpickr("#myID", {});
flatpickr(".myClass", {}); // 複数のインスタンスを生成する場合
flatpickr(element, {}); // https://developer.mozilla.org/en-US/docs/Web/API/Element

設定は{}(オブジェクト)で渡します。

非モジュール環境

上記は非モジュール環境でも同じように使うことができます。 flatpickrのスクリプトを読み込むと、flatpickrが使えるようになります。

ヘルパ関数を使って簡単に呼び出すこともできます。

flatpickr(".mySelector", {});

jQueryの場合

jQueryを利用しているのであれば、プラグインとしてflatpickrを使うことができます。

$(".selector").flatpickr(optional_config);

© 2017 Gregory Petrosyan Released under the MIT license

このコンテンツはGregory Petrosyan(chmln)によるflatpickrドキュメントを翻訳/改変したものです。