3 李科龙

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 12w+

vue中watch的详细用法

在vue中,使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法:<input type="text" v-model="cityName"/>new Vue({ el: '#root', data: { cityName: 'shanghai' }, watch: { cityName(newName, oldName) { // ... } } })直接写一个监听处理函数,当每次监

2020-07-03 09:44:43

使用token 配合路由导航守卫

登录之后存储token到sesstionstorage

2020-06-30 14:16:39

vue 登录信息存储+退出清空

vue 项目登录之后 后台返回接口vue 把接口返回参数存储到vuex 但是vuex 具有刷新按钮 清空问题所以 存到vuex 的同时要存储到 sesstionstorage中在vuex 的state中把把存储到sesstionstorage中的值 赋值给vuex state解决刷新按钮清空vuex 问题 其他页面使用登录接口返回参数时直接从vuex 中获取设置退出按钮 点击退出按钮时清空sesstongstage和vuex 清空vuex 的方法就是刷新...

2020-06-30 13:34:56

async await 基本使用

await 等待的是 promise的resolve 拿到resolve 之后才执行awaitfunction getSomething() { // setTimeout(() => "something", 1000); // return "something";] return new Promise(resolve => { setTimeout(() => resolve("long_time_value"), 2000);

2020-06-22 10:21:50

清空vue的所有state的方法

mutations:{USER_SIGNOUT{Object.key(state).foreach((k)=>{Vue.delete(state,k);})}}

2020-06-19 15:00:07

vue 引入公共样式的三种方法

1、在入口js文件main.js中引入,一些公共的样式文件,可以在这里引入。import Vue from 'vue'import App from './App' // 引入App这个组件import router from './router' /* 引入路由配置 */import axios from 'axios'import '../static/css/global.css' /*引入公共样式*/2、在index.html中引入<!DOCTYPE html><

2020-06-06 10:37:55

vue 引入需要复用的静态js文件

1.在static 中创建js文件2.js 文件中写入需要复用的对象后导出const obj1 = { a : 1, b:2}export default obj1;3main.js 中引入 并且挂载到Vue 的原型上4.组件中引入需要复用的对象别的生命周期也能拿到,随意使用 updated() {console.log(this.obj1,55555) }, ...

2020-06-04 23:10:14

mock JS

mockjs1、简介  mock是一个模拟数据生成器,旨在帮助前端独立于后端进行开发,帮助编写单元测试。其可模拟 Ajax 并返回模拟数据,使前端不用去调用后端的接口,方便测试。2、vue直接使用mockstep1:安装mocknpm install mockjsstep2:直接引入mock.js,并编写mock接口(Mock.mock)。【mock.js】//引入mock模块import Mock from 'mockjs';Mock.mock('/login', { //输出数据

2020-06-03 13:00:01

vue父子组件传值2.0

一、子组件访问父组件的数据方式一 :子组件直接访问父组件的数据父组件在调用子组件时,绑定想要获取的父组件中的数据在子组件内部,使用 props 选项声明获取的数据,即接收来自父组件中的数据创建好的项目目录如下图所示:(不是必须在App.vue中才能使用子组件访问父组件数据)在App.vue 中写入...

2020-06-02 19:40:21

return 返回值问题

function add2(x,y){ sum = x + y; return sum; //返回函数值,return后面的值叫做返回值。}result = add2(3,4);//语句执行后,result变量中的值为7。console.log(result) ; // 7function add2(x,y){ sum = x + y; return sum = 2; //返回函数值,return后面的值叫做返回值。}result = add2(3,4);/

2020-05-29 23:18:48

浅析JS中回调函数及用法

回调函数,什么是回调函数呢?很多初学者都不是很明白,感觉懵懵的,不理解,更不会用!其实简单理解的话就是在一个函数执行完毕后,得到想要的特定数据后在去执行的函数,并没有性药中的那么高深!function getdata(callback){ //这里我们假设是从后端获取数据 setTimeout(function(){ //假设我们获取到数据info var info = { "id":1, "name":'张三' } //得

2020-05-29 22:36:29

【应用】使用 vue-router 之导航守卫 + meta 实现不同的用户角色具有不同的页面访问权限的功能

具体实现:1.router.js文件现在以 superadmin、admin、user 三种不同的用户角色为例,在定义路由时,加上该路由可以由哪种用户角色来访问,代码如下所示:比如说,/HelloWorld 页面这三种用户角色均可访问,/SuperAdmin 页面只能由 superadmin 这一个角色访问。 { path: '/HelloWorld', name: 'HelloWorld', component: HelloWorld, met

2020-05-20 18:01:45

Vue 路由跳转的几种方式

1.0 router-link1. 不带参数 <router-link :to="{name:'home'}"> <router-link :to="{path:'/home'}"> //name,path都行, 建议用name // 注意:router-link中链接如果是'/'开始就是从根路由开始,如果开始不带'/',则从当前路由开始。2.带参数 <router-link :to="{name:'home', params: {id:1}

2020-05-20 16:54:45

Vue.js中this.$nextTick()的使用

this.$nextTick()将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它,然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样,不同的是回调的 this 自动绑定到调用它的实例上。假设我们更改了某个dom元素内部的文本,而这时候我们想直接打印出这个被改变后的文本是需要dom更新之后才会实现的,也就好比我们将打印输出的代码放在setTimeout(fn, 0)中;先来第一个例子看一看<template> <section>

2020-05-20 16:00:35

session,cookie的理解(总结)

摘抄文档会话(Session)跟踪是Web程序中常用的技术,用来跟踪用户的整个会话。常用的会话跟踪技术是Cookie与Session。Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端记录信息确定用户身份。本章将系统地讲述Cookie与Session机制,并比较说明什么时候不能用Cookie,什么时候不能用Session。1.1 Cookie机制在程序中,会话跟踪是很重要的事情。理论上,一个用户的所有请求操作都应该属于同一个会话,而另一个用户的所有请求操作则应该属于另一个会话

2020-05-12 11:39:13

Vue __ob__: Observer

在操作数据的时候发现,ob: Observer这个属性出现之后,如果单独拿数据的值,就会返回undefined。于是就到网上查相关的资料,发现__ob__: Observer是vue一个很重要的知识点。数据对象的 ob 属性ob: Observer这些数据是vue这个框架对数据设置的监控器,一般都是不可枚举的。网上有很多解决的方案:第一种:ob: Observer 是 Vue 对数据监控添加的属性,如果想去掉可以用赋值的方式。例如Object.assign({},this.owner)。 用这种方式

2020-05-09 10:34:03

Vue页面显示骨架屏

Vue页面显示骨架屏1.什么是骨架屏幕?在页面加载数据之前,有一段空白时间,要么用loading加载,要么就用骨架屏。2.如何快速用Vue实现骨架屏效果?#①直接把下面的CSS代码复制,粘贴到vue项目的index.html 的 …里面<style> .skeleton { position: fixed; height: 100%; overf...

2020-04-27 11:17:26

vue中mixins的使用方法和注意点(详)

mixins基础概况vue中的解释是这样的,如果觉得语言枯燥的可以自行跳过嘿~混入 (mixins): 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。怎么用?举个栗子:定义一个混入对象把混入对象混入到当前的组件中用法似不似相当简单呀mixins的特点1 方法和参数在各组件中...

2020-04-27 09:49:58

Vue / keep-alive

keep-alivekeep-alive是Vue提供的一个抽象组件,用来对组件进行缓存,从而节省性能,由于是一个抽象组件,所以在v页面渲染完毕后不会被渲染成一个DOM元素<keep-alive> <loading></loading></keep-laive>当组件在keep-alive内被切换时组件的activated、deact...

2020-04-26 14:28:32

vue中axios实现二进制流文件下载

后端传过来的是一个二进制流方式的docx文件之前试了下网上常见的思路, 这类方法思路如下:使用js在页面常见a标签创建Blob对象, 在Blob中传入后端返回的response.data这一步中Blob需要的是一个数组类型的参数, 后端二进制流这边接收到的response.data使用查看发现是String, 所以我把response.data放进一个长度1的数组, 再传入Blo...

2020-04-26 09:28:58

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 1024勋章
    1024勋章
    #1024程序员节#活动勋章,当日发布原创博客即可获得
  • 勤写标兵Lv3
    勤写标兵Lv3
    授予每个自然周发布7篇到8篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。