Clickをしたら、特定の要素にclassが付与されて、もう一度clickしたら付与したClassが消える、JavaScript書いたことがある人なら誰しもが書いたことがあるであろう、あの処理をVue.jsで。 :class=”{‘is-active’: true} is-classはtureの時にバインドされます。 クラスとスタイルのバインディング
![Vue.jsでtoggleClass](https://cdn-ak-scissors.b.st-hatena.com/image/square/d7db0399f5d2f1163ccd0f7ef4d92ecaf0231fa3/height=288;version=1;width=512/http%3A%2F%2Fwww.kaasan.info%2Fwp-content%2Fuploads%2F2018%2F03%2Fvuejs-600x400.png)
Clickをしたら、特定の要素にclassが付与されて、もう一度clickしたら付与したClassが消える、JavaScript書いたことがある人なら誰しもが書いたことがあるであろう、あの処理をVue.jsで。 :class=”{‘is-active’: true} is-classはtureの時にバインドされます。 クラスとスタイルのバインディング
Vuetify.jsでマテリアルデザインことはじめ 昨日Nuxt.jsの環境構築の記事を書かせて頂きましたが、テンプレートの変更や、ページの追加に触れてNuxt.jsの入門は終了したいと思います。 自分の作ったアプリケーションにcdで移動 your-app-name $ls -ll total 752 -rw-r--r-- 1 chihiro.matsuda staff 376 5 19 00:42 README.md drwxr-xr-x 3 chihiro.matsuda staff 96 5 19 00:42 assets drwxr-xr-x 5 chihiro.matsuda staff 160 5 19 00:42 components drwxr-xr-x 4 chihiro.matsuda staff 128 5 19 00:42 layouts drwxr-xr-x 3
jQueryでゴリゴリajaxでAPIをたたいていたあの頃。jQueryの$.ajaxは一番お世話になったメソッドかも。 Vue.jsでもそっくりなな形で使えるaxiosがとっても便利。 初めてVue.jsでAjax通信する機会があったんですが、axiosっていうnpmがjQueryのajax postと使い勝手が非常に似ていて使いやすかったのでメモ。書き方がほぼほぼjQueryの$.ajaxです。 npm install npm install --save-dev vue-axios axios postする内容はjson形式で記載します。DBに記録するためのPOSTの場合はバックエンドのフレームワークの仕様に合わせてtokenを設定してください。railsだとauthenticity_tokenをセットする必要があります。 postした後の結果についてもthen catchで受け取る
以前、ドラッグ&ドロップでTwitterBootstrapのページが作れるジェネレーターを紹介しました。 今回紹介するPingendoはテンプレートからテキストや画像を変更するだけで美麗なWebページを作ることができます。しかも、Bootstrapのバージョンは4に対応!パララックス効果も設定できるので、デザインまではちょっとご遠慮願いたい、でもそれなりにデザインにはこだわりたいワガママなWebデベロッパーにはオススメ! テンプレートがおしゃれ! TwitterBootstrapのようにパーツを配置しただけのものから、LP作成に最適なテンプレートまで。正直、豊富なテンプレート数とは言い難いですが、画像と文字の入れ替えだけでもそこそこ見栄えするものが作れそうです。 パララックス効果が自分で設定できる! 知識不要でパララックス効果、アニメーションの設定ができます スタイルシートはSASS ジェ
jQueryで色々な自分自身の取得 現在表示中のURLだったり、自分自身のファイル名など、色んな自分自身のを取得するにはlocationが有効です。 現在表示中のURLを取得 アドレスバーに表示されているURLを取得するなら alert(location.href); 現在表示中のホスト取得 現在表示しているホストを取得します。 alert(location.host); 現在表示中のハッシュを取得 現在のURL中のハッシュを取得します。 alert(location.hash); なお、下記のようにするとハッシュによって処理を分けることができる if(location.hash=="#test"){ $("div.hidden").removeClass("hidden"); } 現在ページURLのパス名を取得 alert(location.pathname); パラメータを取得 単純に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く