前端Vue框架使用思路

2022-09-13 21:33:18 字數 948 閱讀 9192

好久好久沒有寫部落格了,最近做了乙個使用vue框架的商場專案,此部落格把vue學習和做專案的過程整理一下。

首先,在掌握html,css,j**ascript 的基礎上,閱讀vue的官方文件,了解vue框架的基本語法。

然後,配置vue環境,分為以下三步:

1.安裝node.js,要注意node的版本問題,可以使用n模組來管理node的版本,安裝命令:npm install -g n, 通過node ls可檢視已安裝過哪些版本,使用/n 版本/命令進行切換

本人是mac 19pro, 因為系統版本10.15.2,安裝會報錯,故需要打命令:sudo chown -r $(whoami) /usr/local/*

2. 安裝vue,安裝vue腳手架,腳手架可以幫助我們快速的建立vue專案,安裝命令:npm install -g @vue/cli

3建立專案,vue create 專案名

4啟動ui,vue ui

5啟動專案,npm run  serve

接下來就可以開始我們的專案了

建立vue例項

import vue from 'vue'

import axios from 'axios'

import vueaxios from 'vue-axios'

import router from './router'

import './assets/css/base.css'

import './assets/css/index.css'

vue.use(vueaxios,axios);

vue.config.productiontip = false

new vue(,

]})

然後就可以開發各個元件了

其中,1、父元件可以使用 props 把資料傳給子元件。

2、子元件可以使用 $emit 觸發父元件的自定義事件。

傳統前端工程使用 Vue 等框架重構的思路

這段時間遇到類似的問題,第一反應便是使用 cli 搭建專案,但是細想一下立馬否決了,原因如下 工程量太大,猴年馬月能重構完,此期間原專案還是沒有任何變動 如果沒人跟你一起同步修改之前老專案的話 無法繼承,除非每次都單獨複製貼上,然後修改相容 把 dist 裡面 弄過去,否則整個專案搬運過去是很繁瑣的...

前端 vue框架

model 模型 資料 view 檢視 html 標籤,樣式 viewmodel 用來結合模型和檢視 決定資料展示在哪個標籤上 vue中的資料和頁面上標籤內容是 繫結 在一起的,模型資料發生了變動,頁面檢視也會相應變化。這種特性稱之為 響應式 框架。佔位,到模型中找相應的資料進行展示,匹配的是模型資...

前端框架 Vue

test 函式呼叫表示式var obj var arr 123,bai obj.name 屬性呼叫表示式 arr 0 屬性呼叫表示式let name wutao name 變數呼叫表示式123 數值字面量表示式 wtao 字串字面量表示式 true 布林字面量表示式 null 空表示式 undefi...