
vue
苏小画
这个作者很懒,什么都没留下…
展开
-
解决vue的跨域问题
vue中解决跨域问题原创 2022-10-26 20:52:40 · 768 阅读 · 0 评论 -
nvm的下载和安装
简介nvm是node的包管理工具。由于在打开不同的项目时,不同的项目在安装依赖时可能会和node版本有关,所以这就需要我们在不同的项目下使用不同的node版本。nvm就是一个比较好用node管理工具,切换node版本。下载地址https://github.com/coreybutler/nvm-windows/releases在setting.txt里面增加node_mirror: https://npm.taobao.org/mirrors/node/npm_mirror: htt原创 2021-12-28 15:48:37 · 1098 阅读 · 0 评论 -
获取验证码倒计时
1.点击获取验证码按钮,样式变成转圈圈并且开始倒计时2.倒计时结束,恢复开始样式<template><div> <el-button type="primary" v-if="q" @click="btn()">获取验证码</el-button><el-button type="primary" :loading="true" v-else>{{counter}}</el-button></div></.原创 2021-03-10 19:51:02 · 907 阅读 · 1 评论 -
router-link中绑定点击事件无效
想在点击登录按钮的同时切换路由以及发送请求。但是绑定点击事件时候却没有打印出我想要的数据。其实只需要在点击事件后面加上.native就可以执行了 <router-link to="/home" @click.native="p">登录</router-link> </div> </div></template><script>export default { data(){ return原创 2021-01-18 16:08:16 · 397 阅读 · 0 评论 -
路由元信息
路由元信息在路由里面添加属性,在路由导航守卫的时候,可以做为需不需要登陆的判断const routes = [ { path: '/', name: 'Home', component: Home, meta:{ title:"首页" } },]const router = new VueRouter({ routes})router.beforeEach((to,from,next)=>{ console.log(t原创 2021-01-13 22:29:07 · 412 阅读 · 0 评论 -
全局路由导航守卫
当你想写发表一篇文章时候,需要登陆账号,那计算器是如果判断你是否登陆呢?后端发送一个token值,利用导航守卫就可以完成检测。代码如下,注:此处token值非后端,仅用于判断真假import Vue from 'vue';import VueRouter from 'vue-router';import Home from '../views/Home.vue';Vue.use(VueRouter);const routes = [ { path: '/', name: 'Ho原创 2021-01-13 22:11:48 · 479 阅读 · 0 评论 -
vue路由中加上name属性的好处·
const routes = [ { path: "/", redirect: { name: "dashboard" } // 路由重定向 }, { path: "/main", name: "main", // name为唯一值,后期如果修改路由地址 也不会受影响 component: main,...原创 2021-01-12 19:37:27 · 1480 阅读 · 0 评论 -
重写push方法,解决相同路由报错问题
VueRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err)}// 重写push方法,解决相同路由报错问题,Vue.use(VueRouter);// 挂在到vue实例上原创 2021-01-12 18:00:59 · 278 阅读 · 0 评论 -
vue懒加载
当一个页面中需要加载大量的js文件时候,会影响页面打开速度,设置懒加载,按照需要加载文件。提高用户体验import Vue from "vue";import VueRouter from "vue-router";import login from "./login";import store from "../store/";import commodityManage from "./commodityManage";import selfAgent from "./selfAgent";原创 2021-01-12 17:59:44 · 246 阅读 · 0 评论 -
axios小案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>天知道&原创 2020-12-31 18:26:33 · 208 阅读 · 0 评论 -
跨域问题
1.什么是跨域跨域指的是浏览器不能执行求她网站的脚本,它是由浏览器的同源策略造成的,是浏览器对js施加的安全限制2.什么是同源?所谓同源是指 域名 协议 端口均相同http://www.qf.com/ -> http://www.admin.qf.com/ 跨域http://www.qf.com/->http://www.qf.com/ 非跨域http://www.qf.com/->http://www.qf.com:8080/ 跨域http://www.qf原创 2020-11-05 20:06:26 · 90 阅读 · 0 评论 -
vue 循环
1.循环数组<template> <div> <ul> <li v-for"(item,index) in list" :key="index"> {{item}}---{{index}}</li> <ul> </div></template><script> export default{ data(){ retrun{ list:[原创 2020-11-04 14:26:29 · 390 阅读 · 0 评论 -
vue改变样式
1.v-bind:class={ red:temp}样式在style中书写,利用v-bind 和真伪temp控制样式2.通过computed返回一个对象,对象里放着多个键值对原创 2020-11-03 19:42:49 · 174 阅读 · 0 评论 -
vue生命周期转
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc原创 2020-10-20 21:57:15 · 356 阅读 · 0 评论 -
vue路由tab栏切换
需要用到的知识点:router router-link router-view componentsapp.vue<template> <div> <router-link to="/logoin">登录</router-link> <router-link to="/header">首页</router-link> <router-view> </router-view> //路由占位符原创 2020-10-18 20:44:17 · 1812 阅读 · 0 评论 -
vue 子组件向父组件传值
子组件<template> <div> <button @click="chlid">点我</button> </div></template><script>export default { data(){ return{ msg:1234 } }, methods:{ chlid(){ this.$emit("fathe",this.ms原创 2020-10-14 23:11:30 · 336 阅读 · 1 评论 -
vue 父组件向子组件传值
父组件<template> <div> <Hello :msg="msg"></Hello> </div></template><script>import Hello from"@/components/HelloWorld.vue"export default { data(){ return{ msg:"我是app的数据" }},components:{ He原创 2020-10-14 21:20:23 · 116 阅读 · 0 评论