UNXT：服務端渲染技術
SEO：搜索引擎優化
搜索引擎收入則網站快。數據和靜態頁面一起抓取作爲靜態的頁面。
---------------------------------------------------------------------------------01----------------------------------------------------------------------------------
搭建NUXT：看文檔要指定兩個名字的。
這個是一個很純的模板的。
改名字：
老師的腳手架環境。
看下目錄：assets主要是存儲靜態的資源文件
layouts：整個的佈局文件
pages：頁面
plugins：放的是插件
store:狀態管理
------------------------------------------------------------------------------02---------------------------------------------------------------------------------
快速入門 佈局：提取頭部和尾部。
第一步：佈局文件。
第二步：中間的是在哪裏來的？
這裏面自動來的。
----------------------------------------------------------------------------03------------------------------------------------------------------------------
頁面路由：
知識點1：自動找頁面
根目錄自動找佈局中間的頁面：
--------------------------------------------------
可以直接這樣寫：
----
這樣也是可以的。
同理：活動：
導航
----------------------------------------------------------------------------04-------------------------------------------------------------------------------
服務端的數據渲染。
鉤子函數：https://www.cnblogs.com/8080zh/p/11164277.html
是在組件的初始化之前調用，是在後端調用的。
牢記，這個就相當於後端的生命週期函數。
這個方法執行的代碼都是在服務區執行的。
UNTX官網：
測試：
加載數據的邏輯要寫在這裏在後臺 加載。
------------------------------------------------------------------------------------------------------------------------------------------------------------
安裝axios:
使用：
----------------------------------------------------------------------------05-------------------------------------------------------------------------------
動態路由：
注意命名規則：
動態的參數要用下劃線開頭的。
------
點擊進入活動詳情：
注意這個寫法：params是多有的參數。_id.vue說明參數名稱是id所以是params.id。
跳轉前：
跳轉後：
注意不是父子路由
也可以這樣的：
表達式加:to
用nuxt不用路由的跳轉。
-----------------------------------------------------------------------------06----------------------------------------------------------------------------------------
利用nuxt實現十次方網站前臺搭建：注意這個是從0開始搭建的，一步一步來的。
第一步：
拷貝
複製到這裏。
第二步：
第三步：
拷貝頭部和尾部。到這個文件。
替換：
複製這個代碼到頭部。同理尾部信息。替換文件的路徑。
引入樣式：
第四步：
頭部信息完成了。
-----------------------------------------------------07----------08-------------------------------------------------------------------------------
拷貝中間的界面。注意替換到模板裏面就可以了。
第一步：
複製這個html。
拷貝到這裏：
第二步：替換：
第三步：導入樣式
注意這個頁面路由的底座是自動匹配的是pages/index.vue的。
-----------------------------------------------------09----頭條頁面-----------------------------------------------------------------------------------------
問答頁面：
第一步：
第二步：
同樣的方法去拷貝。去替換即可。
-----------------------------------------------------10---------------------------------------------------------------------------------------------
活動頁面：
-----------------------------------------------------11---------------------------------------------------------------------------------------------
交友界面：
第一步：
第二步：導入樣式：
----------------------------------------------------12---------------------------------------------------------------------------------------------
吐槽：
第一步：
第二步：拷貝
第三步：替換.
第四步：引入css
-----------------------------------------------------13---------------------------------------------------------------------------------------------
招聘：
-----------------------------------------------------14---------------------------------------------------------------------------------------------
導航：重點看
-----
注意下這三個部分：
其中nuxt自動找：
------
導航的激活提示：
靜態界面：
優化後的：
router的官方文檔看下激活的樣式和包含所有路徑的是如何解決的：https://router.vuejs.org/zh/api/#router-link
-----------------------------------------------------15---------------------------------------------------------------------------------------------
前端分層的思想：數據層，表現層，應用層。
十次方的後臺的代碼思路：
第一步：可以在這裏添加攔截器什麼的。
這個是老的，nuxt是沒有測試和部署環境的。
第二步：引入注意這個參數是咋回事，自己看下源碼什麼的。
-----------------------------------------------------------------------------------------------------------------------------------------------------------------
活動模塊的渲染：
原來：
設計思路：
第一步：創建工具類
第二步：創建api：
第三步：
調用。
注意這個items也是相當於聲明一個data。asyncData的固定寫法而已。
第四步寫靜態界面：
圖片的地址。
---------------------------------------16----------17--------------18------------------------------------------------------------------------------------------
知識點：Vue如何添加插件。
瀑布流的效果：
安裝插件的步驟：
第一步：
安裝插件，可以看到組件已經 加進來了。可是這個插件是如何使用的呢？
第二步：寫插件寫加載插件的邏輯，這樣就可以全局引用了。這個是固定的額寫法。
第三步：在nuxt的配置文件配置一下，注意src指向js
配置插件：注意圖中的第一點1設計不需要服務端進行渲染的。服務端只加載第一頁數據。
第四步：使用
注意數據死拼接的。
---
一個新的發現：
這兩個是等價的。
圖片的地址：https://img-ads.csdn.net/2018/201805171739161420.jpg
----------------------------------------------------19-------------------------------------------------------------------------------------------------------
活動的詳情頁面：
依舊是替換html等。跳新的界面。
-------------------------------------------------20-------------------------------------------------------------------------------------------------------------
頁面的數據渲染。
注意和文件的名稱要一致哦。
地址：http://localhost:3000/gathering/item/1
-------------------------------------------------21-------------------------------------------------------------------------------------------------------------
分享組件：
這個功能是如何實現的呢？
提供了css的樣式表和js我們要在vue中進行與引入。
第一步：
vue引用外部的的js和css如何的使用呢？這個是無法用import導入的。
定義一個頭信息，導入外部的js和css。
第二步：
使用外部的css的js，查看導入情況。
1.所有的圖標
2.指定圖表
3.分享的標題
4.分享的地址
------------------
微信的二維碼默認是根據分享的地址生成的。
-------------------------------------------------22-------------------23------------------------------------------------------------------------------------------
招聘列表：
api的添加。
-------------------------------------------------------24------------------------------------
渲染數據,注意新的寫法哦
這個鉤子函數return了所以我們要保證在這個鉤子裏執行多個函數。
以數組的方式提交。
then就是回調的。
-------------------------------------------------------25------------------------------------
渲染
------------------------------------------------------26-------------------------------------
招聘詳情：
複製靜態資源的代碼。
第一步：改鏈接地址
-------------------------------------------------------27------------------------------------
數據渲染：
原來是這樣的。
邏輯：第一個是職業第二個是職業對應的企業。
嵌套回調。
企業信息根據當前檢索到的職業的id進行檢索。
-------------------------------------------------------28--29----------------------------------
渲染
-------------------------------------------------------30------------------------------------
