项目流程2

指令以v-开头

属性绑定v-bind

事件绑定v-on

 

修饰符是以点开头的特殊后缀

 

main.js是入口文件，先倒入了vue，再倒入了app根组件，再倒入了路由和element对应的组件

 

样式不生效，cmd 下载lessloder依赖包=>npm install less-loader --save-dev，如果还没安装less还需要安装less=>npm install less --save-dev

npm list --depth=0       检查当前目录是否安装了些什么

使用element UI时报错处理：

运行以下命令来尝试安装 element-ui=>    npm install element-ui --save

　　（element-ui 被安装在 node_modules 目录下，可以查看一下是否存在，不需直接引用这个目录下的文件，在Vue.js 项目中按需导入 element-ui 组件）

　　全局范围内使用 element-ui=>在     main.js文件中写

　　　　import Vue from 'vue';

　　　　import ElementUI from 'element-ui';

　　　　import 'element-ui/lib/theme-chalk/index.css';

　　　　 Vue.use(ElementUI);

 

 

解决 WebSocketClient.js?5586:16 WebSocket connection to 'ws://192.168.13.25:8080/ws' failed:

 vue.config.js Vue的配置文件

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
devServer: {
host: '0.0.0.0',
// https:true,
port: 8080,
client: {
webSocketURL: 'ws://0.0.0.0:8080/ws',
},
headers: {
'Access-Control-Allow-Origin': '*',
},
},
transpileDependencies: true,
lintOnSave: false,
})

 

如果返回的结果是promise，比如：.get函数 返回值是promise。所以用 await async 来简化操作，await 只能用在被 async 修饰的方法中

注意的是：紧挨着await的方法修改成 异步的 async方法

 

$router 编程式导航对象

this.$router.push('/home')

 

挂载路由导航守卫

router.beforeEach(( to , from , next ) => {

　　// to 将要访问的路径

　　// from 代表从哪个路径跳转而来

　　// next 是一个函数，表示放行

             //1) next()    直接放行      2) next('/login')   强制跳转

})