2024年Web前端最新vue实现登录路由跳转到成功页面(3)，前端开发面试技巧

刷面试题

刷题的重要性，不用多说。对于应届生或工作年限不长的人来说，刷面试题一方面能够尽可能地快速自己对某个技术点的理解，另一方面在面试时，有一定几率被问到相同或相似题，另外或多或少也能够为自己面试增加一些自信心，可见适当的刷题是很有必要的。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

• 前端字节跳动真题解析

  

• 【269页】前端大厂面试题宝典

  

最后平时要进行自我分析与评价，做好职业规划，不断摸索，提高自己的编程能力和抽象思维能力。大厂面试远没有我们想的那么困难，摆好心态，做好准备，你也可以的。

<input class=“my-input” placeholder=“密码” type=“password”

v-model=“userForm.password” ref=“password” @keyup=“onHCapitalize($event)”/>

<img src=“…/…/static/img/eyesclosed.png” id=“eyes-img” ref=“eyes” @click=“show()”>

大写锁已打开

<el-button type=“primary” @click.native.prevent=“login(‘userForm’)”>Login

4.axios的使用过程

1.在项目cmd输入npm install vue-axios --save 安装axios

2.安装成功后，在main.js页面引用

在组件调用

5.vuex使用

科普：什么是vuex？vuex 是一个专门为vue.js应用程序开发的状态管理模式。

vuex中，有默认的五种基本的对象：

state：存储状态（变量）

getters：对数据获取之前的再次编译，可以理解为state的计算属性。我们在组件中使用 s o t r e . g e t t e r s . f u n ( ) m u t a t i o n s ： 修 改 状 态 ， 并 且 是 同 步 的 。 在 组 件 中 使 用 sotre.getters.fun() mutations：修改状态，并且是同步的。在组件中使用 sotre.getters.fun()mutations：修改状态，并且是同步的。在组件中使用store.commit(’’,params)。这个和我们组件中的自定义事件类似。

actions：异步操作。在组件中使用是$store.dispath(’’)

modules：store的子模块，为了开发大型项目，方便状态管理而使用的。这里我们就不解释了，用起来和上面的一样。

本次的开发只用到了state，mutations。

下载安装vuex

(1) 通过此命令安装 npm install vuex --save

(2)新建如图

引用

在main.js引用

index.js

import Vue from ‘vue’

import Vuex from ‘vuex’

//挂载Vuex

Vue.use(Vuex)

//创建VueX对象

const store = new Vuex.Store({

state:{

//存放的键值对就是所要管理的状态

name:‘这位可爱的游客’

},

mutations: {

updateUserName (state, account) {

state.name = account

}

}

})

export default store

怎么修改state的值呢？

6.element-ui 使用

（1）通过npm i element-ui -S命令安装element-ui

（2）引用

（ 3）调用

四.后端的实现

---

1.LoginController接口的实现

package com.example.myserver.controller;

import org.springframework.web.bind.annotation.*;

ajax

1)ajax请求的原理/ 手写一个ajax请求？
2)readyState？
3)ajax异步与同步的区别？
4)ajax传递中文用什么方法？

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

adow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzQ0OTI0Ng==,size_16,color_FFFFFF,t_70)

四.后端的实现

---

1.LoginController接口的实现

package com.example.myserver.controller;

import org.springframework.web.bind.annotation.*;

ajax

1)ajax请求的原理/ 手写一个ajax请求？
2)readyState？
3)ajax异步与同步的区别？
4)ajax传递中文用什么方法？

[外链图片转存中…(img-sYqS07w1-1715491950275)]

[外链图片转存中…(img-195TvsOe-1715491950276)]

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】