整理一下vue.js 2.0可以跑的元件
用戶
http://pespantelis.github.io/vue-crop/
https://eliep.github.io/vue-avatar/
進度條
http://hilongjw.github.io/vue-progressbar/index.html
日期格式
https://github.com/egoist/vue-timeago
https://github.com/charliekassel/vuejs-datepicker
http://blog.w3cub.com/vue2-calendar/
分頁
https://github.com/TahaSh/vue-paginate
https://github.com/matfish2/vue-pagination-2
星期一, 11月 28, 2016
[Webpack] 解決jquery在webpack載入全域的處理方法
webpack真是個很屌但不熟會搞死人的東西,
為了搞一個全域的jquery函式庫,
找到StackFlow裡面一個大神提供的各種解法
這位大大也有遇到一樣的事:D
https://blog.fntsr.tw/articles/2016/09/13/%E8%AE%93-jquery-%E5%9C%A8-webpack-%E4%B8%AD%E6%88%90%E7%82%BA%E5%85%A8%E5%9F%9F%E8%AE%8A%E6%95%B8/
為了搞一個全域的jquery函式庫,
找到StackFlow裡面一個大神提供的各種解法
這位大大也有遇到一樣的事:D
https://blog.fntsr.tw/articles/2016/09/13/%E8%AE%93-jquery-%E5%9C%A8-webpack-%E4%B8%AD%E6%88%90%E7%82%BA%E5%85%A8%E5%9F%9F%E8%AE%8A%E6%95%B8/
備份文章
星期日, 11月 27, 2016
[Vue.js] 透過directive的機制整合tinymce 使用vue.js 1.x
找到人家wrapper tinymce的範例~
https://jsfiddle.net/edwindeveloper90/edjc82z0/
使用vue.js 1.x寫的
可以看一下怎麼轉2.x的語法
https://jsfiddle.net/edwindeveloper90/edjc82z0/
使用vue.js 1.x寫的
可以看一下怎麼轉2.x的語法
星期三, 11月 16, 2016
[Vue.js] 簡單上手的表單驗證外掛 vee-validator
由於目前專案使用vue.js 2.0,套用vue-validator會有異常。
於是找了另一個替代方案vee-validator,使用簡單好理解也好擴充。
可以參考官方文件: http://vee-validate.logaretm.com/#about
https://dotdev.co/form-validation-using-vue-js-2-35abd6b18c5d#.3j0nq7tne
於是找了另一個替代方案vee-validator,使用簡單好理解也好擴充。
可以參考官方文件: http://vee-validate.logaretm.com/#about
基礎範例
https://dotdev.co/form-validation-using-vue-js-2-35abd6b18c5d#.3j0nq7tne
星期二, 11月 15, 2016
[Wordpress] 讓所有頁面導向具體頁面
如果想把全站的page導向某一頁的話可以在functions.php加入一個action:
template_redirect
template_redirect
function redirect_page_standard() { wp_redirect( get_site_url() . '/notice.html', 301 ); } add_action( 'template_redirect', 'redirect_page_standard' );
星期三, 11月 09, 2016
[Vue.js] Vue的服務端渲染文章筆記
記錄一下服務器渲染(SSR)相關的處理技術文章。
主要有分二種渲染方式,分別為服務器渲染與預渲染 (部份頁面渲染用)。
官方教學
https://vuefe.cn/guide/ssr.html
跟asp.net core結合
http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/
完整的測試範例,程式可跑
http://csbun.github.io/blog/2016/08/vue-2-0-server-side-rendering/
prerender教學
http://hq5544.github.io/vue-webpack/prerender.html
Lavarel專案管理+vue.js完整範例
http://laraveldaily.com/ribbbon-project-management-system-laravel-5-1-vue-js/
主要有分二種渲染方式,分別為服務器渲染與預渲染 (部份頁面渲染用)。
官方教學
https://vuefe.cn/guide/ssr.html
跟asp.net core結合
http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/
完整的測試範例,程式可跑
http://csbun.github.io/blog/2016/08/vue-2-0-server-side-rendering/
prerender教學
http://hq5544.github.io/vue-webpack/prerender.html
Lavarel專案管理+vue.js完整範例
http://laraveldaily.com/ribbbon-project-management-system-laravel-5-1-vue-js/
星期六, 11月 05, 2016
[jQuery] youtube iFrame API無法在iOS上播放影片的解決方法
測試youtube錯誤,最近幫客戶的網站套了jquery.youtubebackground.js RWD的jquery套件後,就噴了以下錯誤。
Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "https://thegrand.com.tw". Protocols, domains, and ports must match
Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "https://thegrand.com.tw". Protocols, domains, and ports must match.
查了一下原來是這個套件用的是youtube的iframe api,因為在iOS上(safari 和chrome)執行playVideo()這個方法是會爆炸了,雖然有提到可以用cueVideoById("youtubeId")來處理。但用了還是不會播,所以目前的workaround就先讓程式判斷iOS不要先執行play,讓用戶自已點取影片。
http://stackoverflow.com/questions/9934944/embedding-youtube-video-refused-to-display-document-because-display-forbidden-b
https://developers.google.com/youtube/player_parameters?hl=zh-cn#IFrame_Player_API
Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "https://thegrand.com.tw". Protocols, domains, and ports must match
Blocked a frame with origin "https://www.youtube.com" from accessing a frame with origin "https://thegrand.com.tw". Protocols, domains, and ports must match.
查了一下原來是這個套件用的是youtube的iframe api,因為在iOS上(safari 和chrome)執行playVideo()這個方法是會爆炸了,雖然有提到可以用cueVideoById("youtubeId")來處理。但用了還是不會播,所以目前的workaround就先讓程式判斷iOS不要先執行play,讓用戶自已點取影片。
http://stackoverflow.com/questions/9934944/embedding-youtube-video-refused-to-display-document-because-display-forbidden-b
https://developers.google.com/youtube/player_parameters?hl=zh-cn#IFrame_Player_API
訂閱:
文章 (Atom)