Vue.js笔记本

Vue.js 測試的pen：

 

要給Vue的component一些動態資料的話，就給它挖個洞，讓它能接受自己定義的屬性（props）

【directive】
Directives are prefixed with v- to indicate that they are special attributes provided by Vue.

v-for
used for displaying a list of items using the data from an Array

v-if=”seen”
如果seen是true的話，這個元件就是可見的

v-bind:xxx=”xxxx”
可以綁定為vue裡的資料，例如

v-bind:title="message"

v-on:click=”methodName”
绑定点击功能

v-model
感覺就像是一個model，原型，資料的來源，大家要跟從牠（因為是model，偶像，可以查查這個英文單字，它也有模範的意思。）可以綁在input上。

v-once
值是固定的，以後不會再變了，例：

<span v-once>This will never change: {{ msg }}</span>

v-html=”xxxx”
若要打html的時候，可以利用這個引擎
xxxx是自己定義的html

前端工程師點擊技能

 

  1. GIT
  2. React
  3. Vue.js
  4. GA
  5. Chrome Devtools
  6. Webstorm
  7. Laragon
  8. GitKraken
  9. npm
  10. webpack
  11. gulp
  12. Node.js

 

後端PHP &Laravel
熟悉ES6, ES7語法
IoT相關經驗
Docker Container(AWS ECS)

Chrome DevTools
https://developers.google.com/web/tools/chrome-devtools/

GitKraken
https://www.gitkraken.com/
官方教学

Atlassian Git Tutorial
https://www.atlassian.com/git/tutorials

React
Hello World – React

Meet WebStorm
https://www.jetbrains.com/help/webstorm/meet-webstorm.html

幹他媽的wordpress掛掉

我的wordpress，就是這個站，竟然掛了，後來自己google找出解決辦法了，參考這一篇
http://www.wpbeginner.com/wp-tutorials/how-to-fix-the-internal-server-error-in-wordpress/

原來是套件有問題，把套件資料夾rename就馬上能連了，頭暈啊😂😂

jQuery实用代码段

此段可用於tab分頁、篩選照片
$(".liveback__buttonlist li a").click(function(){
    $(".liveback__buttonlist li a").removeClass("active");
    $(this).addClass("active");
    var showgirl = $(this).data('type');
    $(".liveback__gallery a").hide();
    $(".liveback__gallery a[data-type='" + showgirl + "']").fadeIn(200);
});

//点哪里滑到哪里
$("#headergifmenu > li > a").click(function () {
    var eventType = $(this).attr("data-type");
    var target = $(".wrapagentall").find(
        "[data-type='" + eventType + "']:first");
    var targetOffset = target.offset().top - 180;
    if (target.length) {
        $("html,body").animate({scrollTop: targetOffset}, 1000);
        return false;
    }
});

onclick連結另開分頁

onclick="window.open('http://us.yahoo.com', '_blank');"

動態附加元素綁定事件

$(document).on("click", ".btn-list", function () {
});

針對動態附加的DOM元素需要這樣寫