1. vue项目创建
1. 首先使用npm安装vue手脚架
安装全局vue手脚架
npm install --global vue-cli
回车
创建项目:新建一个文件夹在这个文件夹下打开cmd命令行
输入下列代码创建项目
vue create 项目名称
在这里选择你需要的vue版本,最下面那个是自定义选择依赖和版本
这是自定义安装的配置依赖
Check the features needed for your project:
//检查项目所需的功能:(按选择,切换所有,反转选择)
( ) Choose Vue version // 选择vue版本,不选择,默认安装`2.6.11`版本的vue ( ) Babel // 语法编译器,es6->es5 ( ) TypeScript // 支持使用 TypeScript 书写源码 ( ) Progressive Web App (PWA) Support // PWA 支持 ( ) Router // 支持 vue-router ( ) Vuex // 支持 vuex ( ) CSS Pre-processors // 支持 CSS 预处理器。 ( ) Linter / Formatter // 支持代码风格检查和格式化。 ( ) Unit Testing // 支持单元测试。 ( ) E2E Testing // 支持E2E测试。
自定义的话只需要选择到你的项目需要的依赖便一直回车即可
可视化安装需要先打开你的cmd命令行输入命令
vue ui
这将会打开一个新的页面,创建项目的配置同上所述
2. 初始化页面代码
vue2代码初始化:
<template> <div> </div> </template> <script> export default { name: 'invite', data() { return { } }, created() { }, methods: {}, } </script> <style> </style>
vue3代码初始化:
<template> <div></div> </template> <script> import { reactive, ref, getCurrentInstance, onBeforeMount, } from "vue"; export default { setup() { let { proxy } = getCurrentInstance(); proxy .$axios({ method: 'post', url: '路径', params: {} }).then(function(res) { console.log(res); }) return { }; } }; </script> <style scoped> </style>