VUE
文章平均质量分 59
Pi皮蛋儿
这个作者很懒,什么都没留下…
展开
-
Vue中登陆超时,返回登陆页面
首先登陆时,将登陆接口返回的 token 用 localStorage 保存起来,然后在 axios 的请求拦截里将 token 添加到请求头部 header 里,作为之后前后端的通信票据// axios 请求设置 请求拦截器axios.interceptores.request.use(config => { var data = {} if(typeof(config.data) === 'string'){ // 如果拦截到请求中data 为 string 类型,则执行其中的代码 .原创 2021-08-20 17:56:45 · 2504 阅读 · 0 评论 -
Vue 强制刷新组件
使用 vue 进行开发时,如果要刷新当前路由,则调用 router.go(0)方法即可。但是某些情况下,我们可能要求仅仅刷新某个组件,而不是路由。。。遇到的问题由于渲染数据较多,导致页面中部分数据没有来得及更新解决方法使用 v-if 指令因为只是刷新某个子组件,我用了 v-if 指令的特性,强制刷新组件。当 v-if 的值发生变化时,组件都会被重新渲染一遍。<template> <comp v-if="update"></comp> &l原创 2021-08-20 11:22:15 · 303 阅读 · 0 评论 -
Vue.js中this.$nextTick()的使用
this.$nextTick()this.$nextTick()将回调延迟到下次DOM 更新循环之后执行。在修改数据之后立即使用它,然后等带DOM更新。它跟全局方法Vue.nextTick一样,不同的是回调的this自动绑定到调用它的实例上。假设我们更改了某个DOM元素内部的文本,而这时我们想直接打印出这个被改变后的文本是需要DOM更新之后才会实现的,也就好比我们将打印输出的代码放在setTimeout(fn,0)中;<template> <section> <原创 2021-08-18 10:36:24 · 296 阅读 · 0 评论 -
Vue中条件判断 v-if 、v-show
v-if中的keyVue会尽可能高效地渲染元素,通常会复用已有元素而不是从头开始渲染。<template v-if="loginType === 'username'"> <label>Username</label> <input placeholder="Enter your username"></template><template v-else> <label>Email</label原创 2021-08-12 10:51:02 · 692 阅读 · 0 评论 -
Vue中watch监听数据变化以及watch中各属性详解
watch使用的几种方法通过watch监听data数据的变化,数据发生变化时,就会打印当前的值data(){ return { msg: '你在想屁吃!', info: '555...', }}watch: { msg(val, newval){ console.log(val) console.log(newval) }}通过watch 监听 docData 文本数据的变化, 数据发生变化时, this.change_number++ ( 使用深度监听 )原创 2021-08-10 18:02:06 · 562 阅读 · 0 评论 -
Vue中computed 计算机属性、getter、setter
计算属性在模板表达式中放入太多逻辑时,会让模板重且难以维护。比如:// 错误示例<div id="example"> {{ message.split('').reverse().join('') }}</div>应该声明一个计算属性,该计算属性不用挂载到Vue实例的data上,而是在Vue实例中的computed上。程序员编写的函数将作用与 property.vm.reversedMessage 的 getter函数具体看https://cn.vuejs.org/原创 2021-08-09 18:11:29 · 794 阅读 · 0 评论 -
Vue中this.$router.replace和this.$router.push的区别
this.$router.push跳转到指定URL,向history栈添加一个新的纪录,点击后退会返回至上一个页面。声明式:< router-link :to = “…” >编程式:< router.push(…) > // 该方法的参数可以是一个字符串路径,或者一个描述地址的对象。// 字符串this.$router.push('/index') // 对象this.$router.push({path:'/index'})// 带查询参数,变成/backen原创 2021-08-09 10:51:13 · 35567 阅读 · 0 评论 -
Vue登录功能
登录概述1.登录业务流程在登录页面输入用户名和密码调用后台接口进行验证通过验证之后,根据后台的响应状态跳转到奥项目主页2.登录业务的相关技术点http 是无状态的通过 cookie 在客户端记录状态通过 session 在服务器端记录状态通过 token 方式维持状态在vue项目中运行在一个新的端口号,服务器与前端vue项目之间有跨域问题。如果前端和后台接口之间不存在跨域问题,推荐使用 cookie 和session 来记录登录状态。 如果存在跨域问题,使用 token 方原创 2021-05-24 19:55:58 · 866 阅读 · 0 评论 -
Vue项目上线
项目上线相关配置通过 node 创建 web 服务器开启 gzip 文件传输压缩开启 https 传输协议,使得传输过程更加安全使用 pm2 管理网站上的所有引用通过 node 创建 web 服务器创建 node 项目,并安装 express,通过 express 快速创建 web 服务器,将 vue 打包生成的 dist 文件夹,托管为静态资源即可,关键代码如下:在根目录新建 vue_shop_server 文件夹在终端 npm init -y 初始化一个包管理配置文件npm i原创 2021-04-27 17:31:58 · 105 阅读 · 0 评论