前言

本章內(nèi)容為VUE基礎(chǔ)與相關(guān)技術(shù)討論。

上一篇文章地址：

Vue 3：玩一下web前端技術(shù)（七）_Lion King的博客-CSDN博客

下一篇文章地址：

（暫無(wú)）

一、基礎(chǔ)

官方文檔：創(chuàng)建一個(gè) Vue 應(yīng)用 | Vue.js

1、創(chuàng)建應(yīng)用

步驟：創(chuàng)建應(yīng)用實(shí)例-》掛載應(yīng)用實(shí)例

import {createApp} from 'vue'  // 應(yīng)用實(shí)例創(chuàng)建函數(shù)
import App from './App.vue'  // 根組件createApp(App).mount('#app')  //創(chuàng)建以App為入口根組件的應(yīng)用實(shí)例

2、模板語(yǔ)法

步驟：VUE文件-》script標(biāo)簽-》template標(biāo)簽-》使用語(yǔ)法

3、響應(yīng)式基礎(chǔ)

4、計(jì)算屬性

5、類與樣式綁定

6、條件渲染

7、列表渲染

8、事件處理

9、表單輸入綁定

10、生命周期

11、偵聽(tīng)器

12、模板引用

13、組件基礎(chǔ)

二、相關(guān)技術(shù)討論

1、VUE中如何引入圖片？

要引入圖片，必須以導(dǎo)入的方式，而不能直接以相對(duì)路徑來(lái)引用。

錯(cuò)誤示范：

imageSrc: "@/assets/logo.png",

正確示范：

import logo from "@/assets/logo.png"  //導(dǎo)入圖片對(duì)象
imageSrc: logo