Vue

Vue

环境准备

npm(Node Package Manager)是NodeJS的软件包管理器。

使用create-vue构建工程化的Vue项目：

npm create vue@3.3.4
cd vue-project
npm install

• node_modules：下载的第三包存放目录。

• src：源代码目录

  • assets：静态资源目录，存放图片、字体
  • Components：组件目录，存放通用组件
  • App.vue：根组件
  • main.js：入口文件

• package.json：项目配置文件，包括项目名、版本号、依赖包、版本等。

• vite.config.js：Vue项目的配置信息，如端口号等。

启动项目：

npm run dev

组合式API

在vue文件内的<script setup></script>标签下可以使用组合式API。

ref()接收一个内部值，返回一个响应式ref对象，此对象只有一个指向内部值的属性value。

onMounted()在组合式API中的钩子方法，注册一个回调函数，在组件挂载完成后执行。

Element plus

npm install element-plus --save

指定--save可以将package信息写入到package.json中。

vue-router

组成：

• Router实例：路由实例，基于createRouter函数创建，维护了应用的路由信息。
• <router-link>：路由链接组件，浏览器会解析成<a>。
• <router-view>：动态视图组件，用来渲染展示与路由路径对应的组件。