介绍

Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。

项目创建

代码示例

计数器

<script setup>
import { ref } from 'vue'
const count = ref(0)
</script>

<template>
  <button @click="count++">Count is: {{ count }}</button>
</template>

<style scoped>
button {
  font-weight: bold;
}
</style>

文本插值

<span>Message: {{ msg }}</span>

响应式绑定

<div v-bind:id="dynamicId"></div>

生命周期

<script setup>
import { onMounted } from 'vue'

onMounted(() => {
  console.log(`the component is now mounted.`)
})
</script>

网络请求-axios

安装

npm install   axios --save

npm环境配置

npm config set registry https://registry.npmmirror.com

调用

import axios from 'axios';

element-plus

安装

npm install element-plus --save

路由

安装

npm install vue-router --save

配置

import {createRouter,createWebHashHistory} from 'vue-router';
import Task from '../components/Task.vue'
const routes = [
	
	{
		path:'/task',
		component:Task
	}
];
 
const router = createRouter({
	history:createWebHashHistory(),
	routes
});
 
export default router;

参考链接

Vue.js - 渐进式 JavaScript 框架 | Vue.js

一个 Vue 3 UI 框架 | Element Plus