柳屋

ソースコードのリファクタからよもやままで

VueJS

ネストされたvue routerを別ファイルで管理する

Vue.jsでSPAを作っていると、ルーティングを機能単位で分けたくなります 例えば、ユーザに関する機能があったとして、ユーザの登録、更新、削除、詳細(所謂 CRUD )それぞれにルーティングを設定する必要があり、それを一つの機能としてルーティングもまと…

VueJS + AdminLTEで管理画面を作る

管理画面を作る事になったんですが、せっかくなのでSPAでやってみたいなってなったのでVueJSで作ることにしました。 HTML CSSはサクッと作りたいなと思ったので、管理画面作成に特化したBootstrapベースの AdminLTE を使うことにしました VueJS環境作成 yana…

Cloud9でvue-cli環境を作る

最近、開発はめっきりcloud9でやってます。 Cloud9便利ですよね。 環境構築する必要がないのですぐ試せるし クラウドなのでPCさえあればどこでも同じ環境ですぐ実行できます さらに現在の現場ではプロキシかまされててGitHub等にpushできないんですが、Cloud…

Lumenでクロスドメインアクセス設定

現在 VueJSとLumenでSPAのサービスを作っているのですが クロスドメインに引っかかり一日がっつりハマったので備忘録も兼ねて 記述 結論 色々試行錯誤したのですが結局以下で出来ました。 Lumenのapi/public/index.phpに以下を追記 header('Access-Control-A…

Vue.jsでlazyloadを実装

意外に自作するコードが少なかったので、書いてみました。 ソース <div id="vue-instance"> <img src="loading.gif">// ローディング画像 <img src="hoge.jpg" v-on:load="hideLoading">// 表示させたい画像 </div> var vm = new Vue({ el: '#vue-instance', methods: { hideLoading: (event) => { event.target.previousElementSibling.remove(); } } }); 画像…

;(function(document){ var pres = document.getElementsByTagName("pre") for(var i=pres.length; i--; ){  var el = makeOl(pres[i]) pres[i].appendChild(el) } function makeOl(pre){ if (pre.className.indexOf("gist") !== -1) { return } var ol = document.createElement("ol") , li = document.createElement("li") , df = document.createDocumentFragment() , br = pre.innerHTML.match(/\n/g) || 0 ol.className = "preLine" ol.setAttribute("role", "presentation") // no lang, no line-number if( pre.className && ! /lang-./.test(pre.className) ){ br.length += 1 } for(var i=br.length; i--; ){ var li2 = li.cloneNode(true) df.appendChild(li2) } ol.appendChild(df) return ol } })(document)