user6054116914083
获得徽章 0
- this.$router.push(path): 相当于点击路由链接(可以返回到当前路由界面)
this.$router.replace(path): 用新路由替换当前路由(不可以返回到当前路由界面)
this.$router.back(): 请求(返回)上一个记录路由
this.$router.go(-1): 请求(返回)上一个记录路由
this.$router.go(1): 请求下一个记录路由展开评论点赞 - 二、JWT
2 原理
全称是json web token， 简单来说JWT就是通过可逆加密算法，生成一串包含用户、过期时间等关键信息的Token，每次请求服务器拿到这个Token解密出来就能得到用户信息，从而判断用户状态。
1.客户端登录成功后（必须是在登陆成功才行，与session一样的前提条件），服务器会根据用户名和签名以及其他信息加密生成唯一的token串，用来区分他们，不需要存入服务端的缓存中，但会把这个token返回给相应的主机
2.主机收到token后会存入cookie或者localStorage中，以后主机的每一次发送其他类型的请求的操作都会携带这个token
3.服务器会将客户端发来的这个token和服务端从数据库查询出来的并且重新计算得到的用户信息进行对比，如果匹配，则认证成功，如果用户请求的资源需要相应的权限，则校验token中的payload中存储的权限等相关信息，如果有权限则返回给对应主机所需要的资源（即做到了权限鉴权），否则拒绝
3 token+redis与jwt的区别
1.简单的说，token只是一个标识，以token加redis为例，服务端将token保存在redis中，客服端访问时带上token，如果在redis中能够查到这个token，说明身份有效。
2.jwt不需要查库，本身已经包含了用户的相关信息，可以直接通过服务端解析出相关的信息，与session，token的最大区别就是服务端不保存任何信息（服务端只需要保存密钥key）展开评论点赞 - minxin其实是一个对象，里面的结构大致跟普通组件的script里面的一样，有data属性，钩子函数和方法等
混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。
在实际项目中，可以新建一个js文件，导出一个minxin对象 在引用的组件中引入使用即可展开评论点赞 - 一.什么是mixins（混入）？
mixins是对vue组件的一种扩展，将一些公用的常用数据或者方法，构建一个可被混入的数据结构，被不同的vue组件进行合并，就可以在不同的vue组件中使用相同的方法或者基础数据。
二.作用:
1.更高效的实现组件内容的复用
2.将组件内部data,method等与父组件相应内容进行合并,相当于在引入后,父组件的各种属性,方法进行了扩充
3.对数据,对象进行合并,要以组件为优先
展开评论点赞 - Window 对象是浏览器全局对象，表示浏览器应用窗口，包含许多与浏览器相关的属性和方法，例如 window.document、window.navigator、window.location 等等。通过这些属性和方法，我们可以访问和操作 HTML 页面的元素和内容，以及获取与浏览器相关的信息。
例如:
- window.document 可以直接操纵 HTML 文档，对页面上的元素进行增删改查。
- window.location 可以让我们访问当前页面的 URL，并且可以用于重定向用户到其他页面。
- window.history 可以操作浏览器的历史记录 ，如 back() 和 forward()。
- window.resizeTo() 和 window.moveTo() 可以调整浏览器窗口的大小或位置。
- window.open() 可以打开新的浏览器窗口。
- window.close() 可以关闭浏览器窗口。
需要注意的是，并非所有这些属性和方法都能正常使用，因为浏览器可能出于安全原因，会把它们禁用。
展开评论点赞 - Vue2和Vue3的区别主要在以下几个方面：生命周期函数钩子、数据双向绑定原理、定义变量和方法、指令和插槽的使用、API类型、是否支持碎片、父子之间传参、main.js文件中部分设置等1。其中，Vue3使用了ES6的Proxy API对数据代理，通过reactive()函数给每一个对象都包一层Proxy，从而实现对数据的监控2。Vue3还支持碎片(Fragments)，即组件可以拥有多个根节点2。此外，Vue3提供了setup方法来声明响应性数据展开评论点赞
- 1.设置或获取对象指定的文件名或路径：
获取整个 URL 为字符串(常用):window.location.href
2.获取与 URL 关联的端口号码:window.location.port
eg:http://localhost:8088/#home?tenancyId=4bfaaa6d-410e-11ec-875a-00505685097e =>8088
3.设置或获取 URL 的协议部分:window.location.protocol
eg:http://localhost:8088/#home?tenancyId=4bfaaa6d-410e-11ec-875a-00505685097e =>http
4.设置或获取 href 属性中在井号“#”后面的分段。window.location.hash
eg:http://localhost:8088/#home?tenancyId=4bfaaa6d-410e-11ec-875a-00505685097e
=> #home?tenancyId=4bfaaa6d-410e-11ec-875a-00505685097e
5.设置或获取 location 或 URL 的 hostname 和 port 号码:window.location.host
eg:http://localhost:8088/#home?tenancyId=4bfaaa6d-410e-11ec-875a-00505685097e展开评论点赞 - 状态码200：
状态码200表示服务器响应成功，也就是服务器找到了客户端请求的内容，并且将内容返回给客户端。
状态码302：
状态码302代表临时跳转。例如：URL地址A可以向URL地址B上跳转，但这并不是永久性的，在经过一段时间后，URL地址A还可能向URL地址C上跳转。
状态码301 ：
状态码301和状态码302相似，不同的是状态码301往往代表的是永久性的重定向，值得注意的是，这种重定向跳转，从严格意义来讲不是服务器跳转，而是客户端跳转的。这个“跳”的动作是服务器是通过回传状态码301来下达给客户端的，让客户端完成跳转。
状态码304：
服务器通过返回状态码304可以告诉客户端请求资源成功，但是这个资源不是由服务器提供返回给客户端的，而是客户端本地浏览器缓存中就有的这个资源，因为可以从缓存中获取这个资源，从而节省传输的开销。
状态码403：
状态码403代表请求的服务器资源权限不够，也就是说，没有权限去访问服务器的资源，或者请求的IP地址被封掉了。
状态码404：
状态码404代表服务器上没有该资源，或者说服务器找不到客户端请求的资源，是最常见的请求错误码。展开评论点赞 - 1.Promise.resolve()函数被执行时, 会将promise的状态从 pending 改成fulfilled成功
2.Promise.reject()函数被执行时, 会将promise的状态从pending 改成rejected失败
new Promise((resolve, reject) => {
reject() //Promise.reject()----> rejected 失败
// resolve() Promise.resolve()----->fulfilled 成功
})
3.Promise.all([promise1, promise2, promise3]) 等待原则, 是在所有promise都完成后执行, 可以用于处理一些并发的任务，如果Promise实例都进入Fulfilled状态，Promise.all返回的实例才会变成Fulfilled状态并将Promise实实例数组的所有返回值组成一个数组，传给Promise.all返回实例的回调函数；如果有某一个或者多个实例进入rejected状态，Promise.all返回的实例会立即变成Rejected状态并将第一个rejected的实例返回值传递给Promise.all返回实例的回调函数。
应用场景
4.Promise.race([promise1, promise2, promise3])赛跑, 竞速原则, 只要三个promise中有一个满足条件, 就会执行.then(用的较少)，先执行到成功就返回成功的状态，返回失败就是失败状态
展开评论点赞 - 1.computed计算属性：
作用：
（1）解决模板中放入过多的逻辑会让模板过重且难以维护的问题。例如两个数据的拼接或字体颜色的判断。
（2）它支持缓存，只有依赖的数据发生了变化，才会重新计算。例如模板中多次用到数据拼接可以用计算属性，只执行一次计算，除非数据发生变化。
（3）不支持异步，如果有异步操作，无法监听数据的变化。
（4）如果属性值是函数，默认使用get方法，函数的返回值就是属性的属性值。还有一个set方法，当数据变化时就会调用set方法。
（5）computed的值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data声明过，或者父组件传递过来的props中的数据进行计算的。
2.watch侦听器：
作用：
（1）它不支持缓存，数据变化时，它就会触发相应的操作。
（2）支持异步监听。
（3）接受两个参数，第一个是最新的值，第二个是变化之前的值。
（4）监听data或者props传来的数据，发生变化时会触发相应操作。有两个参数：
immediate：立即触发回调函数。
deep：深度监听，发现数据内部的变化，在复杂数据类型中使用，例如数组中的对象发生变化。需要注意的是，deep无法监听到数组和对象内部的变化。展开评论点赞