iT邦幫忙

1

vue 初來乍到,問問幾個問題?

看了些系列文和vue官方文件
只是對於有些功能不知道如何湊合?

  1. header, footer?
    以往我是用 php 就可以做到這件事,或是透過 laravel 的 blade
    就固定讀同一個 index,所有 html 資訊都在這裡新增即可,不需要一個頁面一個 html(or php)
    這點在 vue 會如何實現?

  2. 在切換網頁的時候不需要換頁,vue 是否也可以 spa?
    如同 ig 網頁版不需要換頁那樣,(ig 使用 react),在 vue 的實現上是否也相對方便?

  3. 有些功能是不是用 jquery 實現比較好?
    像有些點開後會 fadeIn, 漢堡排菜單...等等,這些在 vue 的實現上是否會更加輕鬆?還是說可以混著用?

  4. 選擇 jquery 或 vue 的前提是網站的規模?
    如果同樣是做一個「約會網站」(舉例),兩者實現的時程會是差不多的嗎?應該是說高手們會選擇用哪個開發?

  5. 我是 jquery 派的,最近打算開始學 vue,直接和友人實戰一個網站(對方是nodejs),會需要注意什麼呢?

  6. 之前都是透過 php 設定開發環境,如果是單純前端語言,該如何分「環境」呢?

  7. 我看到有些人會產生 .vue 檔,這是什麼作用呢?

感謝各路好手分享經驗!

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
3
dragonH
iT邦超人 5 級 ‧ 2019-11-30 18:31:18
最佳解答

1 .

這點在 vue 會如何實現

待補

codepen

2 .

在切換網頁的時候不需要換頁,vue 是否也可以 spa?

Vue.js (commonly referred to as Vue; pronounced /vjuː/, like view) is an open-source Model–view–viewmodel JavaScript framework for building user interfaces and single-page applications.

vue wiki

所以

可以
3 .

有些功能是不是用 jquery 實現比較好

看你習慣

不過

基本上用了 vue

jquery 可以放到一邊去了

jquery 是以 dom 為主

vue 則是以 data 為主

還是說可以混著用?

可以

但是我不會這麼做

4 .

選擇 jquery 或 vue 的前提是網站的規模?

不一定

看你習慣

也不是 vue 出來後才有規模大的網站

兩者實現的時程會是差不多的嗎?

看你功力 + 習慣

應該是說高手們會選擇用哪個開發?

我是低手

我會選擇 vue

用過就回不去了 /images/emoticon/emoticon07.gif

5 .

我是 jquery 派的,最近打算開始學 vue,直接和友人實戰一個網站(對方是nodejs),會需要注意什麼呢?

加強你 js 的功力

6 .

之前都是透過 php 設定開發環境,如果是單純前端語言,該如何分「環境」呢?

看不懂

7 .

我看到有些人會產生 .vue 檔,這是什麼作用呢?

用 vue cli 建的專案

.vue 的檔案就是一個 component

看更多先前的回應...收起先前的回應...

你好認真0.0

dragonH iT邦超人 5 級 ‧ 2019-11-30 18:37:48 檢舉

/images/emoticon/emoticon26.gif

froce iT邦大師 1 級 ‧ 2019-11-30 20:32:47 檢舉

你真的很認真耶,我才懶得給他code。
反正他離component還有一段距離。

dragonH iT邦超人 5 級 ‧ 2019-11-30 20:38:43 檢舉

反正我也很少用這種 cdn 引用的方式來寫

剛好練習一下XD

以後有人爬到類似文章或許也能參考/images/emoticon/emoticon48.gif

ni0 iT邦新手 5 級 ‧ 2019-12-05 15:30:02 檢舉

感謝分享!
最近必須把jq和vue混著用
深有感觸@_@

Vision iT邦新手 5 級 ‧ 2020-02-09 01:13:13 檢舉

第6點應該是 分 production & development 環境的意思

如果是這樣的話,使用 vue-cil 細部設定是可以的,細節詳見官網
補充分環境的觀念:

  1. 執行 npm run build & npm run server 分別為 production & development 環境
  2. 可以使用 node.js 環境變數 process.env.NODE_ENV 去判別是 production 還是 development 模式,常用於以下用途
    • 靜態資源的路徑變更
    • API 來源變更

以上為基礎概念,進階使用詳見 webpack, vue-cil is base of webpack.

1
阿展展展
iT邦好手 1 級 ‧ 2019-11-30 13:21:56

header, footer?
以往我是用 php 就可以做到這件事,或是透過 laravel 的 blade
就固定讀同一個 index,所有 html 資訊都在這裡新增即可,不需要一個頁面一個 html(or php)
這點在 vue 會如何實現?

請見 vue component

在切換網頁的時候不需要換頁,vue 是否也可以 spa?
如同 ig 網頁版不需要換頁那樣,(ig 使用 react),在 vue 的實現上是否也相對方便?

vue 輕量

有些功能是不是用 jquery 實現比較好?
像有些點開後會 fadeIn, 漢堡排菜單...等等,這些在 vue 的實現上是否會更加輕鬆?還是說可>以混著用?

選擇 jquery 或 vue 的前提是網站的規模?
如果同樣是做一個「約會網站」(舉例),兩者實現的時程會是差不多的嗎?應該是說高手們會選擇>用哪個開發?

我是 jquery 派的,最近打算開始學 vue,直接和友人實戰一個網站(對方是nodejs),會需要注>意什麼呢?

jQ 的優劣大概網路上找的到9487篇文章
https://yami.io/jquery-to-vuejs/
我就取上面這篇中的兩點來說好了

太過依賴元素內容:

商品數量應該獨立成一個變數,而不是把頁面上的元素當作一個「存放區」用來擺放商品數量。

資料分散:

商品數量現在分散在頁面上的各個角落,如果要更新商品數量,就必須把這些元素通通再寫一遍。搞不好還會不小心忽略其中一些元素。

你這次問題排的比較有條裡一點
確實下面那兩題是比較後段的部份

之前都是透過 php 設定開發環境,如果是單純前端語言,該如何分「環境」呢?
我看到有些人會產生 .vue 檔,這是什麼作用呢?

所以...你知道 vue 多少了?

1
froce
iT邦大師 1 級 ‧ 2019-11-30 18:32:46

header, footer?
以往我是用 php 就可以做到這件事,或是透過 laravel 的 blade
就固定讀同一個 index,所有 html 資訊都在這裡新增即可,不需要一個頁面一個 html(or php)
這點在 vue 會如何實現?

寫在app.vue就行了,搭配vue router

在切換網頁的時候不需要換頁,vue 是否也可以 spa?
如同 ig 網頁版不需要換頁那樣,(ig 使用 react),在 vue 的實現上是否也相對方便?

vue當然可以spa,搭配vue router

有些功能是不是用 jquery 實現比較好?
像有些點開後會 fadeIn, 漢堡排菜單...等等,這些在 vue 的實現上是否會更加輕鬆?還是說可以混著用?

在vue上更輕鬆,因為你很容易可以寫一個可複用component,寫一次甚至不怎麼要寫,用別人的就行了。(不過用別人的debug的話很痛苦)

選擇 jquery 或 vue 的前提是網站的規模?
如果同樣是做一個「約會網站」(舉例),兩者實現的時程會是差不多的嗎?應該是說高手們會選擇用哪個開發?

這真的要看規模,如果真的很簡單的網站,vue不一定會比較快,但如果你的網站有大量資料變動時要同時更新的元件、大量的資料驗證....
用vue會很方便。

我是 jquery 派的,最近打算開始學 vue,直接和友人實戰一個網站(對方是nodejs),會需要注意什麼呢?

jq和vue是兩種完全不同的思維方式,jq操作DOM、vue操作資料。

之前都是透過 php 設定開發環境,如果是單純前端語言,該如何分「環境」呢?

不懂你的環境指的是什麼,vue通常是完全的前端工作,不應該跟後端的php開發扯上關係,前後端的溝通是靠api。
唯一要注意的是vue router的模式和後端的route設置。

我看到有些人會產生 .vue 檔,這是什麼作用呢?

component

你vue還沒搞懂,以目前你的理解應該還沒到可以真的完成一個系統的程度。
剛剛看了問的人的ID...
我覺得你還是繼續用JQ好了,連上次JSON問題都得問人的話...我覺得你很難在短時間掌握vue的開發方式。
vue會大量用運到map、reduce、filter和其他你平常不會用到的 Array 方法。

0

僅包含關鍵字

  1. VUE component
  2. VUE=spa, VUE router
  3. 可以混用,是不同的東西
  4. 是不同的東西,vue是框架,jquery是函式庫。一個好比網頁工廠,另一個是工具箱。
  5. Axios,socketio
  6. vue .env
  7. Vue cli 自行摸索

我要發表回答

立即登入回答