岁月如歌☆-CSDN博客

转载 axios的封装

axios的二次封装：import Vue from 'vue';import axios from 'axios';import store from '../store/index'import qs from 'qs'; // axios自带模块若报错找不到重新安装即可// 全局的 axios 默认值// axios.defaults.baseURL = 'https://api.example.com';// axios.defaults.headers.common['Autho

2021-06-10 16:54:28 159

原创路由传参以及跳转

路由传参以及跳转：this.$router相当于一个全局的路有对象，包含了很多属性和对象（比如history对象），任何页面都可以调用其push()、replace()、go()等方法this.$route表示当前路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name、path、params、query等属性。简单来说：$router:是路由操作对象，只写对象$route:是路由信息对象，只读对象// 操作路由跳转this.$router.push({ na

2021-06-10 13:56:03 3129

原创自定义表单校验规则

elementUI表单的自定义校验规则内容转载自：https://www.jianshu.com/p/93c5cd5f3226?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation<el-dialog title="新增学生" :visible.sync="addStudent" width="400px"> <el-form

2021-06-10 09:09:08 218

原创 element ui表格动态绑定检验规则

element ui表格动态绑定检验规则demo：<template> <div> <el-form :model="tableForm" ref="tableForm"> <el-table :data="tableForm.tableData" border style="width: 100%" > <el-table-column label="

2021-06-01 17:30:13 435

原创解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题

导航栏重复点菜单报错的解决办法首先打开我们的路由配置文件:import Vue from 'vue';import Router from 'vue-router';Vue.use(Router);// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题const originalPush = Router.prototype.pushRouter.prototype.push = function push(location) { return o

2021-06-01 14:21:50 157

原创 vue组件如何reload或者说vue-router如何刷新当前的route

使用场景为增加商品表单，用户确定提交后，继续新增，需要清理之前用户输入数据，并对其初始化，再走一遍组件加载的流程，其中还包括几个子组件，如果手动去处理实在是太麻烦！！利用v-if控制router-view，在路由容器组件，如APP.vue中实现一个刷新方法<template> <router-view v-if="isRouterAlive"/></template><script>export default { data () { r

2021-06-01 13:54:47 2416

原创上传文件的几种主要方法。

上传文件的几种主要方法。第一种：经典的form和input上传。设置form的aciton为后端页面，enctype=“multipart/form-data”，type=‘post’<form action='uploadFile.php' enctype="multipart/form-data" type='post'>　　<input type='file'>　　<input type='hidden' name='userid'>　　<inpu

2021-05-31 14:13:46 12970 1

原创 Webpack之魔法注释/* webpackChunkName:“lodash“ */的做用

Webpack之魔法注释/* webpackChunkName:“lodash” */的做用## 标题作用就是webpack在打包的时候，对异步引入的库代码（lodash）进行代码分割时（需要配置webpack的SplitChunkPlugin插件），为分割后的代码块取得名字import异步加载的写法实现页面模块lazy loading懒加载（Vue中的路由异步加载）：Vue中运用import的懒加载语句以及webpack的魔法注释，在项目进行webpack打包的时候，对不同模块进行代码分割，在首

2021-05-24 09:18:03 1845

原创防抖节流实现示例

节流函数示例：// fn是我们需要包装的事件回调, interval是时间间隔的阈值function throttle(fn, interval) { // last为上一次触发回调的时间 let last = 0 // 将throttle处理结果当作函数返回 return function () { // 保留调用时的this上下文 let context = this // 保留调用时传入的参数 let args = argume

2021-05-12 15:33:19 114

原创＜router-view :key=“key“/＞中key的作用

router-view 作用，你可以 router-view 当做是一个容器，它渲染的组件是你使用 vue-router 指定的。<template> <section class="app-main"> <transition name="fade-transform" mode="out-in"> <router-view :key="key" /> </transition> </section&

2021-05-12 15:06:04 2837

转载 mixin的使用方法

mixin用法：vue中提供了一种混合机制–mixins，用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixins和普通情况下引入组件有什么区别？组件在引用之后相当于在父组件内开辟了一块单独的空间，来根据父组件props过来的值进行相应的操作，单本质上两者还是泾渭分明，相对独立。而mixins则是在引入组件之后，则是将组件内部的内容如data等方法、method等属性与父组件相应内容进行合并。相当于在引入后，父组件的各种属性方法都被扩充了。单

2021-05-12 15:01:47 1463

原创 JS实现表格添加删除功能

JavaScript部分 <script> var inp1 = document.getElementsByClassName('userName')[0].getElementsByTagName('input')[0]; var inp2 = document.getElementsByClassName('userAge')[0].getElementsByTagName('input')[0]; var inp22 = document

2020-10-30 22:36:45 784

原创 CSS3简易动画

爱心移动的动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{

2020-09-15 09:39:30 114

weixin_50377234的博客