vue基础入门

一.创建工程

    cmd:vue ui

    项目管理器 创建项目 包管理器npm 功能选中router
.添加页面

        页面可以放在views里

    主页面是app.vue

    页面映射在router/index.js下

三.杂项

1.修改为允许未使用变量

    config.js:

module.exports = {
    lintOnSave:false}

   node_modules/color-name/ .eslintrc.js

"no-unused-vars": 'off'

四.插件

1.axios

    安装:npm install axios

    使用方式:vue页面下的函数

var that=this
var url = "             //url
var formData = new URLSearchParams();
formData.append('token', that.token);//可以这样存放要post的信息
axios.post(url+'/token/revtoken',formData)                             //放数据的接口
.then(function (response) {                         //收到的数据
    console.log(response);                    //response就是返回数据
    that.uid = response.data.uid; 
    that.upw = response.data.upw;     
})
.catch(function (error) {
    console.log(error);
});

2.element-plus

安装方式和使用方式均参考官网即可

https://element-plus.gitee.io/zh-CN/guide/installation.html#%E4%BD%BF%E7%94%A8%E5%8C%85%E7%AE%A1%E7%90%86%E5%99%A8

main.js配置

安装图标

npm install @element-plus/icons-vue

安装本体

npm install element-plus --save
import { createApp } from 'vue'
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css';
import App from './App.vue';
import router from './router'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
const app = createApp(App)
app.use(ElementPlus)
app.use(router)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
}
app.mount('#app')

点赞

发表回复