iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

初學者前端應用30天 系列

前端javascript、Vue.js(vue cli)相關內容和套件使用

鐵人鍊成 | 共 30 篇文章 | 7 人訂閱 訂閱系列文 RSS系列文 團隊imac_web_Sr
DAY 11

[DAY11]vue 元件傳值

基本觀念 我們今天要介紹的是vue元件(component)傳值,包括父傳子、子傳父和兄弟互傳,在實現元件互傳之前,我們要先來解釋父子元件關係,現在有a、b兩個...

2020-09-24 ‧ 由 jxes6102 分享
DAY 12

[DAY12] js 陣列常用語法(上) 12

我們在寫程式時陣列是很常用到的東西,我們來看看js有提供那些方法來對陣列做改動。 type typeof(obj),可得知obj的型態,會輸出string、nu...

2020-09-25 ‧ 由 jxes6102 分享
DAY 13

[DAY13] js 陣列常用語法(下)

此篇繼續介紹更多陣列的用法。 fill 將指定範圍的陣列修改。 originarray:["one","two",&qu...

2020-09-26 ‧ 由 jxes6102 分享
DAY 14

[DAY14]vuex 簡單介紹

什麼是vuex? vuex是一個好用的傳值套件,他可以無視元件之間的關係,做到跨元件傳值的功能。可以讓你很方便地管理全站共用的資料 / 狀態。 基本說明: 一開...

2020-09-27 ‧ 由 jxes6102 分享
DAY 15

[DAY15]轉場效果

我們這次來說vue的動畫效果,並用個簡單範例來說明。首先我們要用動畫效果要先用transition標籤加入妳要做動畫的元素,並用一個button onclick...

2020-09-28 ‧ 由 jxes6102 分享
DAY 16

[DAY16]vue-drag-resize套件

vue-drag-resize是一個有趣的套件,可以把它當成可以拖動的div。 篇文章是參考:點此連結 安裝 開啟cmd到專案資料夾打 npm i -s vue...

2020-09-29 ‧ 由 jxes6102 分享
DAY 17

[DAY17] vue media套件

media套件是基於Css來改動,他可以偵測版面大小來控制html元素或調整css的效果。 本篇文章是參考:點我 安裝 在你的專案資料夾開啟cmd輸入 npm...

2020-09-30 ‧ 由 jxes6102 分享
DAY 18

[DAY18] vue hooper 套件

今天來介紹hooper套件,他可以做到好看的切換畫面效果,我們會做一個簡單範例來說明。 此文章是參考:點我 安裝 cmd 到專案資料夾 npm install...

2020-10-01 ‧ 由 jxes6102 分享
DAY 19

[DAY19]vue socket 簡易實作

我們這次來嘗試vue和socket的結合,做一個簡單的聊天介面。 安裝 先在專案資料夾新增一個js檔,用來做socket伺服端。在view裡新增一個元件,記得設...

2020-10-02 ‧ 由 jxes6102 分享
DAY 20

[DAY20]檔案閱讀器

我們這次要做檔案閱讀器,他可以解析副檔名,如果是圖片檔,就會顯示在畫面上,且會判斷圖片尺寸來做到縮放效果,如果不是圖片檔,點擊檔名會下載該檔案,其實跟vue沒有...

2020-10-03 ‧ 由 jxes6102 分享